add something

src/lib/components/ResolveDialog.svelte

@@ -3,6 +3,16 @@
   import { AlertCircle, Check, LoaderCircle, X } from "@lucide/svelte";
   import type { ConflictChoice, ConflictFile, ConflictPart, GitFileStatus, PreparedResolution } from "../types";
 
+  type ConflictRegion = Extract<ConflictPart, { kind: "conflict" }>;
+  type ResolveSplitRow =
+    | { type: "marker"; conflictIndex: number }
+    | {
+        type: "pair";
+        conflictIndex?: number;
+        leftNum?: number; leftText?: string; leftKind: "context" | "ours" | "empty";
+        rightNum?: number; rightText?: string; rightKind: "context" | "theirs" | "empty";
+      };
+
   interface Props {
     conflictedFiles: GitFileStatus[];
     conflictTarget: string;
@@ -36,6 +46,9 @@
   let resolveContent = $state("");
   let manualMode = $state(false);
   let binarySide = $state<"ours" | "theirs" | null>(null);
+  let resolveBeforePane = $state<HTMLDivElement | null>(null);
+  let resolveAfterPane = $state<HTMLDivElement | null>(null);
+  let isSyncingResolveScroll = false;
 
   $effect(() => {
     const c = conflict;
@@ -75,6 +88,8 @@
   });
 
   let conflictRegionCount = $derived(conflictParts.filter((p) => p.kind === "conflict").length);
+  let conflictRegions = $derived(conflictOnlyParts(conflictParts));
+  let resolveSplitRows = $derived(buildResolveSplitRows(conflictParts));
   let unresolvedCount = $derived(manualMode ? 0 : conflictChoices.filter((c) => c == null).length);
   let resolvedContent = $derived(manualMode ? resolveContent : buildResolution(conflictParts, conflictChoices));
   let resolveHasMarkers = $derived(/^<{7}/m.test(resolvedContent) || /^>{7}/m.test(resolvedContent));
@@ -125,6 +140,74 @@
     return out.join("\n");
   }
 
+  function conflictOnlyParts(parts: ConflictPart[]): ConflictRegion[] {
+    return parts.filter((part): part is ConflictRegion => part.kind === "conflict");
+  }
+
+  function buildResolveSplitRows(parts: ConflictPart[]): ResolveSplitRow[] {
+    const rows: ResolveSplitRow[] = [];
+    let leftNum = 0;
+    let rightNum = 0;
+
+    for (const part of parts) {
+      if (part.kind === "text") {
+        for (const line of part.lines) {
+          leftNum++;
+          rightNum++;
+          rows.push({
+            type: "pair",
+            leftNum,
+            leftText: line,
+            leftKind: "context",
+            rightNum,
+            rightText: line,
+            rightKind: "context",
+          });
+        }
+        continue;
+      }
+
+      rows.push({ type: "marker", conflictIndex: part.index });
+      const count = Math.max(part.oursLines.length, part.theirsLines.length);
+      for (let i = 0; i < count; i++) {
+        const hasOurs = i < part.oursLines.length;
+        const hasTheirs = i < part.theirsLines.length;
+        if (hasOurs) leftNum++;
+        if (hasTheirs) rightNum++;
+        rows.push({
+          type: "pair",
+          conflictIndex: part.index,
+          leftNum: hasOurs ? leftNum : undefined,
+          leftText: hasOurs ? part.oursLines[i] : undefined,
+          leftKind: hasOurs ? "ours" : "empty",
+          rightNum: hasTheirs ? rightNum : undefined,
+          rightText: hasTheirs ? part.theirsLines[i] : undefined,
+          rightKind: hasTheirs ? "theirs" : "empty",
+        });
+      }
+    }
+
+    return rows;
+  }
+
+  function syncResolveScroll(source: "before" | "after") {
+    if (isSyncingResolveScroll) return;
+    const sourcePane = source === "before" ? resolveBeforePane : resolveAfterPane;
+    const targetPane = source === "before" ? resolveAfterPane : resolveBeforePane;
+    if (!sourcePane || !targetPane) return;
+
+    isSyncingResolveScroll = true;
+    targetPane.scrollTop = sourcePane.scrollTop;
+    targetPane.scrollLeft = sourcePane.scrollLeft;
+    requestAnimationFrame(() => {
+      isSyncingResolveScroll = false;
+    });
+  }
+
+  function legacyConflictParts(): any[] {
+    return [];
+  }
+
   function setConflictChoice(index: number, choice: ConflictChoice) {
     const next = [...conflictChoices];
     next[index] = choice;
@@ -296,7 +379,71 @@
               ></textarea>
             {:else}
               <div class="resolve-structured">
-                {#each conflictParts as part, partIndex (partIndex)}
+                {#if conflictRegions.length > 0}
+                  <div class="resolve-conflict-controls" aria-label="Conflict decisions">
+                    {#each conflictRegions as part (part.index)}
+                      <div class="resolve-conflict-bar" class:unresolved={conflictChoices[part.index] == null}>
+                        <span class="resolve-conflict-label">Conflict {part.index + 1}</span>
+                        <div class="resolve-choice-buttons">
+                          <button type="button" class:active={conflictChoices[part.index] === "ours"} onclick={() => setConflictChoice(part.index, "ours")} disabled={isBusy}>Current</button>
+                          <button type="button" class:active={conflictChoices[part.index] === "theirs"} onclick={() => setConflictChoice(part.index, "theirs")} disabled={isBusy}>Incoming</button>
+                          <button type="button" class:active={conflictChoices[part.index] === "both-ot"} onclick={() => setConflictChoice(part.index, "both-ot")} disabled={isBusy} title="Both - current first">Both C+I</button>
+                          <button type="button" class:active={conflictChoices[part.index] === "both-to"} onclick={() => setConflictChoice(part.index, "both-to")} disabled={isBusy} title="Both - incoming first">Both I+C</button>
+                        </div>
+                      </div>
+                    {/each}
+                  </div>
+                {/if}
+
+                <div class="resolve-split" role="table" aria-label="Full conflict comparison">
+                  <div
+                    class="resolve-pane"
+                    bind:this={resolveBeforePane}
+                    aria-label="Current file content"
+                    onscroll={() => syncResolveScroll("before")}
+                  >
+                    <div class="resolve-pane-grid">
+                      {#each resolveSplitRows as row, i (`left-${i}`)}
+                        {#if row.type === "marker"}
+                          <div class="resolve-split-marker" class:unresolved={conflictChoices[row.conflictIndex] == null}>Conflict {row.conflictIndex + 1}</div>
+                        {:else}
+                          <div class="resolve-num" class:ours={row.leftKind === "ours"} class:empty={row.leftKind === "empty"}>{row.leftNum ?? ""}</div>
+                          <div
+                            class="resolve-cell"
+                            class:ours={row.leftKind === "ours"}
+                            class:empty={row.leftKind === "empty"}
+                            class:dimmed={row.conflictIndex != null && !oursActive(conflictChoices[row.conflictIndex])}
+                          >{displayLine(row.leftText ?? "") || " "}</div>
+                        {/if}
+                      {/each}
+                    </div>
+                  </div>
+                  <div
+                    class="resolve-pane"
+                    bind:this={resolveAfterPane}
+                    aria-label="Incoming file content"
+                    onscroll={() => syncResolveScroll("after")}
+                  >
+                    <div class="resolve-pane-grid">
+                      {#each resolveSplitRows as row, i (`right-${i}`)}
+                        {#if row.type === "marker"}
+                          <div class="resolve-split-marker" class:unresolved={conflictChoices[row.conflictIndex] == null}>Conflict {row.conflictIndex + 1}</div>
+                        {:else}
+                          <div class="resolve-num" class:theirs={row.rightKind === "theirs"} class:empty={row.rightKind === "empty"}>{row.rightNum ?? ""}</div>
+                          <div
+                            class="resolve-cell"
+                            class:theirs={row.rightKind === "theirs"}
+                            class:empty={row.rightKind === "empty"}
+                            class:dimmed={row.conflictIndex != null && !theirsActive(conflictChoices[row.conflictIndex])}
+                          >{displayLine(row.rightText ?? "") || " "}</div>
+                        {/if}
+                      {/each}
+                    </div>
+                  </div>
+                </div>
+
+                {#if false}
+                {#each legacyConflictParts() as part, partIndex (partIndex)}
                   {#if part.kind === "text"}
                     {#if part.lines.length > 0}
                       <pre class="resolve-context">{#each part.lines as line}<span class="resolve-line context">{displayLine(line) || " "}</span>{/each}</pre>
@@ -323,6 +470,7 @@
                     </div>
                   {/if}
                 {/each}
+                {/if}
               </div>
             {/if}