add something

package-lock.json

@@ -11,6 +11,7 @@
         "@lucide/svelte": "^1.21.0",
         "@tailwindcss/vite": "^4.3.1",
         "@tauri-apps/api": "^2.5.0",
+        "simple-icons": "^16.24.1",
         "svelte": "^5.0.0",
         "tailwindcss": "^4.3.1"
       },
@@ -2106,6 +2107,25 @@
         "node": ">=6"
       }
     },
+    "node_modules/simple-icons": {
+      "version": "16.24.1",
+      "resolved": "https://registry.npmjs.org/simple-icons/-/simple-icons-16.24.1.tgz",
+      "integrity": "sha512-AnDQPrZAVzYSym7cBVIrnbhLk9auWGgkl+9hKvkbTqGEfH6TU7WKgumEXYYaJuM1Ib87+cnzr881UZniCM7t+A==",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/simple-icons"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/simple-icons"
+        }
+      ],
+      "license": "CC0-1.0",
+      "engines": {
+        "node": ">=0.12.18"
+      }
+    },
     "node_modules/source-map-js": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",

package.json

@@ -16,6 +16,7 @@
     "@lucide/svelte": "^1.21.0",
     "@tailwindcss/vite": "^4.3.1",
     "@tauri-apps/api": "^2.5.0",
+    "simple-icons": "^16.24.1",
     "svelte": "^5.0.0",
     "tailwindcss": "^4.3.1"
   },

src-tauri/src/git.rs

@@ -117,6 +117,8 @@ enum CheckoutPlan {
     Raw(String),
 }
 
+const FULL_FILE_DIFF_CONTEXT: &str = "--unified=1000000";
+
 #[tauri::command]
 pub fn open_repository(path: String) -> Result<GitStatus, String> {
     let repo = resolve_repo(&path)?;
@@ -247,6 +249,13 @@ pub fn commit(path: String, message: String) -> Result<GitStatus, String> {
         return Err("Commit-Message darf nicht leer sein.".to_string());
     }
 
+    let current_status = status_for_repo(&repo)?;
+    if has_unresolved_conflicts(&current_status) {
+        return Err(
+            "Merge-Konflikte muessen geloest werden, bevor du committen kannst.".to_string(),
+        );
+    }
+
     run_git(&repo, ["commit", "-m", message.as_str()])?;
     status_for_repo(&repo)
 }
@@ -310,10 +319,7 @@ pub fn merge_branch(path: String, branch: String) -> Result<GitStatus, String> {
     // Surface those through the status so the UI can offer conflict resolution
     // instead of treating the conflict as a hard error.
     let status = status_for_repo(&repo)?;
-    if status.files.iter().any(|file| {
+    if has_unresolved_conflicts(&status) {
-        matches!(file.staged, Some(FileStatusKind::Conflicted))
-            || matches!(file.unstaged, Some(FileStatusKind::Conflicted))
-    }) {
         return Ok(status);
     }
 
@@ -447,7 +453,16 @@ pub fn compare_commits(
             to_hash.as_str(),
         ],
     )?;
-    let patch_output = run_git(&repo, ["diff", "-M", from_hash.as_str(), to_hash.as_str()])?;
+    let patch_output = run_git(
+        &repo,
+        [
+            "diff",
+            "-M",
+            FULL_FILE_DIFF_CONTEXT,
+            from_hash.as_str(),
+            to_hash.as_str(),
+        ],
+    )?;
 
     let files = parse_diff_files(&name_status, &numstat)?;
     let patch = String::from_utf8_lossy(&patch_output).to_string();
@@ -484,7 +499,7 @@ pub fn diff_file_against_working_tree(
     )?;
     let patch_output = run_git_with_paths(
         &repo,
-        &["diff", "-M", commit_hash.as_str()],
+        &["diff", "-M", FULL_FILE_DIFF_CONTEXT, commit_hash.as_str()],
         std::slice::from_ref(&file),
     )?;
 
@@ -748,6 +763,13 @@ fn status_for_file(statuses: &[GitFileStatus], path: &str) -> Option<FileStatusK
     status.unstaged.or(status.staged)
 }
 
+fn has_unresolved_conflicts(status: &GitStatus) -> bool {
+    status.files.iter().any(|file| {
+        matches!(file.staged, Some(FileStatusKind::Conflicted))
+            || matches!(file.unstaged, Some(FileStatusKind::Conflicted))
+    })
+}
+
 fn parse_commit_log(repo: &Path, output: &[u8]) -> Result<Vec<GitCommit>, String> {
     const FIELD_SEPARATOR: char = '\x1f';
     const RECORD_SEPARATOR: char = '\x1e';
@@ -1713,7 +1735,8 @@ mod tests {
 
         fs::write(repo.path.join("old.txt"), "original\nsecond line\n")
             .expect("tracked file should change");
-        fs::write(repo.path.join("added.txt"), "brand new\n").expect("added file should be written");
+        fs::write(repo.path.join("added.txt"), "brand new\n")
+            .expect("added file should be written");
         run_git_test(&repo.path, ["add", "old.txt", "added.txt"]);
         run_git_test(&repo.path, ["commit", "-q", "-m", "second"]);
         let second_commit = git_output_test(&repo.path, ["rev-parse", "HEAD"]);
@@ -1736,6 +1759,40 @@ mod tests {
         assert!(comparison.patch.contains("second line"));
     }
 
+    #[test]
+    fn compare_commits_includes_full_file_context() {
+        let repo = init_temp_repo("compare_full_context");
+        let before = (1..=60)
+            .map(|line| format!("line {line}\n"))
+            .collect::<String>();
+
+        fs::write(repo.path.join("context.txt"), &before).expect("context file should be written");
+        run_git_test(&repo.path, ["add", "context.txt"]);
+        run_git_test(&repo.path, ["commit", "-q", "-m", "base"]);
+        let first_commit = git_output_test(&repo.path, ["rev-parse", "HEAD"]);
+
+        fs::write(
+            repo.path.join("context.txt"),
+            before.replace("line 30\n", "line 30 changed\n"),
+        )
+        .expect("context file should be changed");
+        run_git_test(&repo.path, ["add", "context.txt"]);
+        run_git_test(&repo.path, ["commit", "-q", "-m", "change"]);
+        let second_commit = git_output_test(&repo.path, ["rev-parse", "HEAD"]);
+
+        let comparison = compare_commits(
+            repo.path.to_string_lossy().to_string(),
+            first_commit,
+            second_commit,
+        )
+        .unwrap();
+
+        assert!(comparison.patch.contains(" line 1\n"));
+        assert!(comparison.patch.contains(" line 60\n"));
+        assert!(comparison.patch.contains("-line 30\n"));
+        assert!(comparison.patch.contains("+line 30 changed\n"));
+    }
+
     #[test]
     fn diff_file_against_working_tree_reports_uncommitted_changes() {
         let repo = init_temp_repo("diff_against_working_tree");
@@ -1786,8 +1843,11 @@ mod tests {
             .output()
             .expect("git merge should start");
 
-        let conflict =
+        let conflict = read_conflict(
-            read_conflict(repo.path.to_string_lossy().to_string(), "file.txt".to_string()).unwrap();
+            repo.path.to_string_lossy().to_string(),
+            "file.txt".to_string(),
+        )
+        .unwrap();
         assert_eq!(
             conflict.ours.unwrap().replace("\r\n", "\n"),
             "ours change\n"
@@ -1813,6 +1873,40 @@ mod tests {
         assert_eq!(contents.replace("\r\n", "\n"), "resolved\n");
     }
 
+    #[test]
+    fn commit_rejects_unresolved_merge_conflicts() {
+        let repo = init_temp_repo("commit_rejects_conflicts");
+        fs::write(repo.path.join("file.txt"), "base\n").expect("base file should be written");
+        run_git_test(&repo.path, ["add", "file.txt"]);
+        run_git_test(&repo.path, ["commit", "-q", "-m", "base"]);
+        let main_branch = git_output_test(&repo.path, ["rev-parse", "--abbrev-ref", "HEAD"]);
+
+        run_git_test(&repo.path, ["checkout", "-q", "-b", "feature"]);
+        fs::write(repo.path.join("file.txt"), "theirs change\n").expect("feature change");
+        run_git_test(&repo.path, ["commit", "-q", "-am", "feature change"]);
+
+        run_git_test(&repo.path, ["checkout", "-q", main_branch.as_str()]);
+        fs::write(repo.path.join("file.txt"), "ours change\n").expect("main change");
+        run_git_test(&repo.path, ["commit", "-q", "-am", "main change"]);
+
+        let _ = Command::new("git")
+            .arg("-C")
+            .arg(&repo.path)
+            .args(["merge", "--no-edit", "feature"])
+            .output()
+            .expect("git merge should start");
+
+        let err = commit(
+            repo.path.to_string_lossy().to_string(),
+            "should not commit".to_string(),
+        )
+        .unwrap_err();
+
+        assert!(err.contains("Merge-Konflikte"));
+        let status = status_for_repo(&repo.path).unwrap();
+        assert!(has_unresolved_conflicts(&status));
+    }
+
     #[test]
     fn detects_binary_content_by_nul_byte() {
         assert!(is_binary_bytes(&[0u8, 1, 2, 3]));
@@ -1822,7 +1916,8 @@ mod tests {
     #[test]
     fn binary_conflict_can_be_resolved_by_side() {
         let repo = init_temp_repo("binary_conflict");
-        fs::write(repo.path.join("img.bin"), [0u8, 1, 2, 3]).expect("base binary should be written");
+        fs::write(repo.path.join("img.bin"), [0u8, 1, 2, 3])
+            .expect("base binary should be written");
         run_git_test(&repo.path, ["add", "img.bin"]);
         run_git_test(&repo.path, ["commit", "-q", "-m", "base"]);
         let main_branch = git_output_test(&repo.path, ["rev-parse", "--abbrev-ref", "HEAD"]);
@@ -1842,8 +1937,11 @@ mod tests {
             .output()
             .expect("git merge should start");
 
-        let conflict =
+        let conflict = read_conflict(
-            read_conflict(repo.path.to_string_lossy().to_string(), "img.bin".to_string()).unwrap();
+            repo.path.to_string_lossy().to_string(),
+            "img.bin".to_string(),
+        )
+        .unwrap();
         assert!(conflict.binary);
         assert!(conflict.content.is_empty());
         assert_eq!(conflict.ours_size, Some(3));

src/App.svelte

@@ -95,10 +95,13 @@
   $: changedFiles = status?.files ?? [];
   $: stagedCount = status?.files.filter((f) => f.staged !== null).length ?? 0;
   $: unstagedCount = status?.files.filter((f) => f.unstaged !== null).length ?? 0;
-  $: canCommit = hasRepository && stagedCount > 0 && commitMessage.trim().length > 0 && !isBusy;
-  $: canCompare = hasRepository && compareFrom.length > 0 && compareTo.length > 0 && compareFrom !== compareTo && !isBusy;
   $: conflictedFiles = changedFiles.filter((f) => f.staged === "conflicted" || f.unstaged === "conflicted");
   $: hasConflicts = conflictedFiles.length > 0;
+  $: canCommit = hasRepository && stagedCount > 0 && commitMessage.trim().length > 0 && !hasConflicts && !isBusy;
+  $: commitBlockReason = hasConflicts
+    ? `${conflictedFiles.length} ${conflictedFiles.length === 1 ? "merge conflict must" : "merge conflicts must"} be resolved before committing.`
+    : "";
+  $: canCompare = hasRepository && compareFrom.length > 0 && compareTo.length > 0 && compareFrom !== compareTo && !isBusy;
   $: localBranches = branches.filter((b) => !b.remote);
   $: remoteBranches = branches.filter((b) => b.remote);
 
@@ -371,6 +374,10 @@
   async function commitChanges() {
     const message = commitMessage.trim();
     if (!message || !activeRepoPath) return;
+    if (hasConflicts) {
+      errorMessage = "Resolve all merge conflicts before committing.";
+      return;
+    }
     await runOperation("Committing", async () => {
       applyStatus(await commit(activeRepoPath, message));
       commitMessage = "";
@@ -670,6 +677,7 @@
           <CommitPanel
             {commitMessage}
             {canCommit}
+            {commitBlockReason}
             {hasRepository}
             {isBusy}
             {operation}

src/app.css

@@ -572,6 +572,28 @@
   .explorer-row.active { background: rgba(90,140,248,0.1); border-color: rgba(90,140,248,0.28); }
   .explorer-row.folder { font-weight: 700; }
   .explorer-row svg { color: var(--color-accent); }
+  .explorer-row svg.file-icon.code     { color: #7aacff; }
+  .explorer-row svg.file-icon.markup   { color: #f08a5d; }
+  .explorer-row svg.file-icon.style    { color: #c678dd; }
+  .explorer-row svg.file-icon.json     { color: #e0c15c; }
+  .explorer-row svg.file-icon.config   { color: #9aa6d6; }
+  .explorer-row svg.file-icon.script   { color: #4eca76; }
+  .explorer-row svg.file-icon.text     { color: #b8c2e0; }
+  .explorer-row svg.file-icon.image    { color: #54c7ec; }
+  .explorer-row svg.file-icon.audio    { color: #d98cf0; }
+  .explorer-row svg.file-icon.video    { color: #ff8ba7; }
+  .explorer-row svg.file-icon.archive  { color: #d8a657; }
+  .explorer-row svg.file-icon.sheet    { color: #4eca76; }
+  .explorer-row svg.file-icon.database { color: #5fc5d9; }
+  .explorer-row svg.file-icon.font     { color: #f0d080; }
+  .explorer-row .language-icon {
+    display: block;
+    width: 15px;
+    height: 15px;
+    flex: 0 0 15px;
+    fill: currentColor;
+  }
+  .explorer-row .language-icon path { fill: currentColor; }
 
   .tree-toggle, .explorer-select { min-height: 20px; padding: 0; border: 0; background: transparent; color: var(--color-ink-muted); }
   .tree-toggle { width: 14px; }
@@ -584,6 +606,16 @@
 
   .commit-form { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; gap: 8px; padding: 10px; }
   .commit-form textarea { flex: 1 1 0; min-height: 80px; resize: none; }
+  .commit-block-reason {
+    margin: 0;
+    padding: 8px 10px;
+    border: 1px solid rgba(232,96,96,0.28);
+    border-radius: 6px;
+    color: #ef8080;
+    background: rgba(232,96,96,0.08);
+    font-size: 12px;
+    line-height: 1.35;
+  }
 
   /* --- Commit history --- */
 
@@ -703,6 +735,10 @@
     box-shadow: 0 24px 72px rgba(0, 0, 0, 0.6), 0 2px 12px rgba(0,0,0,0.4);
     overflow: hidden;
   }
+  .compare-dialog {
+    width: min(1560px, calc(100vw - 32px));
+    height: min(940px, calc(100vh - 32px));
+  }
 
   .dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--color-border-subtle); background: var(--color-surface-dim); }
 
@@ -712,6 +748,7 @@
   .dialog-close { min-height: 32px; min-width: 32px; padding: 0; justify-content: center; }
 
   .dialog-body { display: grid; grid-template-columns: 280px minmax(0, 1fr); min-height: 0; }
+  .compare-dialog .dialog-body { grid-template-columns: minmax(260px, 320px) minmax(0, 1fr); }
 
   .dialog-files { display: grid; align-content: start; gap: 4px; padding: 8px; overflow: auto; border-right: 1px solid var(--color-border-subtle); background: var(--color-surface-dim); }
 
@@ -755,10 +792,12 @@
 
   .split-diff {
     display: grid;
-    grid-template-columns: 3.2rem minmax(0, 1fr) 1px 3.2rem minmax(0, 1fr);
+    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
     align-content: start;
     flex: 1 1 0;
-    overflow: auto;
+    min-width: 0;
+    min-height: 0;
+    overflow: hidden;
     font-family: var(--font-mono);
     font-size: 12px;
     line-height: 1.5;
@@ -766,6 +805,21 @@
     background: var(--color-surface-raised);
   }
 
+  .split-pane {
+    min-width: 0;
+    min-height: 0;
+    overflow: auto;
+    scrollbar-gutter: stable;
+  }
+  .split-pane + .split-pane { border-left: 1px solid var(--color-border-subtle); }
+
+  .split-pane-grid {
+    display: grid;
+    grid-template-columns: 3.2rem minmax(max-content, 1fr);
+    align-content: start;
+    min-width: 100%;
+  }
+
   .split-span {
     grid-column: 1 / -1;
     padding: 2px 10px;
@@ -792,14 +846,13 @@
     padding: 0 8px;
     white-space: pre;
     color: var(--color-ink-muted);
-    overflow: hidden;
+    min-width: 0;
+    overflow: visible;
   }
   .split-cell.del   { background: rgba(232,96,96,0.1); color: #ef8080; }
   .split-cell.add   { background: rgba(78,202,118,0.09); color: #5dd88a; }
   .split-cell.empty { background: rgba(0,0,0,0.06); }
 
-  .split-divider { background: var(--color-border-subtle); }
-
   .split-col-headers {
     display: grid;
     grid-template-columns: 1fr 1fr;
@@ -1153,18 +1206,105 @@
   }
 
   .resolve-structured {
-    display: grid;
+    display: flex;
-    align-content: start;
+    flex-direction: column;
     gap: 8px;
     flex: 1 1 auto;
     min-height: 0;
     padding: 4px;
-    overflow: auto;
+    overflow: hidden;
     border: 1px solid var(--color-border-subtle);
     border-radius: 6px;
     background: var(--color-surface-raised);
   }
 
+  .resolve-conflict-controls {
+    display: grid;
+    align-content: start;
+    gap: 6px;
+    flex: 0 0 auto;
+    max-height: 126px;
+    overflow: auto;
+  }
+
+  .resolve-conflict-controls .resolve-conflict-bar {
+    padding: 7px 8px;
+    border: 1px solid rgba(224,160,64,0.25);
+    border-radius: 6px;
+    background: rgba(224,160,64,0.06);
+  }
+  .resolve-conflict-controls .resolve-conflict-bar.unresolved {
+    border-color: rgba(232,96,96,0.3);
+    background: rgba(232,96,96,0.06);
+  }
+
+  .resolve-split {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+    flex: 1 1 auto;
+    min-width: 0;
+    min-height: 0;
+    overflow: hidden;
+    border: 1px solid var(--color-border-subtle);
+    border-radius: 6px;
+    background: rgba(0,0,0,0.12);
+    font-family: var(--font-mono);
+    font-size: 12px;
+    line-height: 1.5;
+    tab-size: 2;
+  }
+
+  .resolve-pane {
+    min-width: 0;
+    min-height: 0;
+    overflow: auto;
+    scrollbar-gutter: stable;
+  }
+  .resolve-pane + .resolve-pane { border-left: 1px solid var(--color-border-subtle); }
+
+  .resolve-pane-grid {
+    display: grid;
+    grid-template-columns: 3.2rem minmax(max-content, 1fr);
+    align-content: start;
+    min-width: 100%;
+  }
+
+  .resolve-split-marker {
+    grid-column: 1 / -1;
+    padding: 3px 8px;
+    color: #e0a040;
+    background: rgba(224,160,64,0.12);
+    font-family: var(--font-mono);
+    font-size: 11px;
+    font-weight: 800;
+    text-transform: uppercase;
+  }
+  .resolve-split-marker.unresolved { color: #ef8080; background: rgba(232,96,96,0.12); }
+
+  .resolve-num {
+    padding: 0 6px 0 4px;
+    border-right: 1px solid var(--color-border-subtle);
+    color: var(--color-ink-faint);
+    background: rgba(0,0,0,0.14);
+    text-align: right;
+    user-select: none;
+  }
+  .resolve-num.ours   { color: rgba(78,202,118,0.65); background: rgba(78,202,118,0.11); border-right-color: rgba(78,202,118,0.2); }
+  .resolve-num.theirs { color: rgba(122,172,255,0.65); background: rgba(122,172,255,0.11); border-right-color: rgba(122,172,255,0.2); }
+  .resolve-num.empty  { background: rgba(0,0,0,0.07); }
+
+  .resolve-cell {
+    min-width: 0;
+    padding: 0 8px;
+    overflow: visible;
+    color: var(--color-ink-muted);
+    white-space: pre;
+  }
+  .resolve-cell.ours   { color: #5dd88a; background: rgba(78,202,118,0.1); }
+  .resolve-cell.theirs { color: #8fb4ff; background: rgba(90,140,248,0.11); }
+  .resolve-cell.empty  { background: rgba(0,0,0,0.06); }
+  .resolve-cell.dimmed { opacity: 0.42; filter: grayscale(0.5); }
+
   .resolve-context { margin: 0; padding: 2px 8px; overflow-x: auto; font-family: var(--font-mono); font-size: 12px; line-height: 1.5; tab-size: 2; color: var(--color-ink-muted); }
 
   .resolve-conflict { display: grid; gap: 6px; padding: 8px; border: 1px solid rgba(224,160,64,0.25); border-radius: 6px; background: rgba(224,160,64,0.06); }
@@ -1274,6 +1414,7 @@
   .compare-form   { grid-template-columns: 1fr; }
   .compare-arrow  { display: none; }
   .dialog-body    { grid-template-columns: 1fr; grid-template-rows: minmax(120px, 0.4fr) minmax(0, 1fr); }
+  .compare-dialog .dialog-body { grid-template-columns: 1fr; grid-template-rows: minmax(120px, 0.4fr) minmax(0, 1fr); }
   .dialog-files   { border-right: none; border-bottom: 1px solid var(--color-border-subtle); }
   .branch-actions { flex-direction: row; justify-content: flex-start; }
   .tb-action-label { display: none; }

src/lib/components/CommitPanel.svelte

@@ -4,6 +4,7 @@
   interface Props {
     commitMessage: string;
     canCommit: boolean;
+    commitBlockReason: string;
     hasRepository: boolean;
     isBusy: boolean;
     operation: string;
@@ -15,6 +16,7 @@
   let {
     commitMessage = "",
     canCommit = false,
+    commitBlockReason = "",
     hasRepository = false,
     isBusy = false,
     operation = "",
@@ -45,7 +47,10 @@
       placeholder="Commit message..."
       disabled={!hasRepository || isBusy}
     ></textarea>
-    <button class="btn-primary w-full flex-shrink-0" type="submit" disabled={!canCommit}>
+    {#if commitBlockReason}
+      <p class="commit-block-reason">{commitBlockReason}</p>
+    {/if}
+    <button class="btn-primary w-full flex-shrink-0" type="submit" disabled={!canCommit} title={commitBlockReason || "Commit staged changes"}>
       {#if operation === "Committing"}
         <LoaderCircle class="spin" size={16} aria-hidden="true" />
       {:else}

src/lib/components/CompareDialog.svelte

@@ -26,8 +26,26 @@
     onSelectFile = () => {},
   }: Props = $props();
 
+  let beforePane = $state<HTMLDivElement | null>(null);
+  let afterPane = $state<HTMLDivElement | null>(null);
+  let isSyncingSplitScroll = false;
+
+  function syncSplitScroll(source: "before" | "after") {
+    if (isSyncingSplitScroll) return;
+    const sourcePane = source === "before" ? beforePane : afterPane;
+    const targetPane = source === "before" ? afterPane : beforePane;
+    if (!sourcePane || !targetPane) return;
+
+    isSyncingSplitScroll = true;
+    targetPane.scrollTop = sourcePane.scrollTop;
+    targetPane.scrollLeft = sourcePane.scrollLeft;
+    requestAnimationFrame(() => {
+      isSyncingSplitScroll = false;
+    });
+  }
+
   function displayDiffFile(file: GitDiffFile): string {
-    return file.old_path ? `${file.old_path} → ${file.path}` : file.path;
+    return file.old_path ? `${file.old_path} -> ${file.path}` : file.path;
   }
 
   function buildDiffByPath(patch: string): Map<string, string> {
@@ -106,17 +124,18 @@
 
       if (isMeta) {
         flush();
-        rows.push({ type: "span", kind: "meta", text: line });
+        continue;
       } else if (line.startsWith("@@")) {
         flush();
         const m = line.match(/@@ -(\d+)(?:,\d+)? \+(\d+)(?:,\d+)? @@/);
         if (m) { leftNum = parseInt(m[1]) - 1; rightNum = parseInt(m[2]) - 1; }
-        rows.push({ type: "span", kind: "hunk", text: line });
+      } else if (line.startsWith("\\ ")) {
+        flush();
       } else if (line.startsWith("-")) {
         dels.push(line);
       } else if (line.startsWith("+")) {
         adds.push(line);
-      } else {
+      } else if (line.startsWith(" ")) {
         flush();
         leftNum++;
         rightNum++;
@@ -125,6 +144,9 @@
           leftNum,  leftText:  line.slice(1), leftKind:  "context",
           rightNum, rightText: line.slice(1), rightKind: "context",
         });
+      } else {
+        flush();
+        rows.push({ type: "span", kind: "meta", text: line });
       }
     }
     flush();
@@ -142,7 +164,7 @@
   role="presentation"
   onclick={(e) => { if (e.target === e.currentTarget) onClose(); }}
 >
-  <div class="dialog" role="dialog" aria-modal="true" aria-label="Commit comparison" tabindex="-1">
+  <div class="dialog compare-dialog" role="dialog" aria-modal="true" aria-label="Commit comparison" tabindex="-1">
 
     <header class="dialog-header">
       <div>
@@ -214,18 +236,41 @@
 
             <!-- Split diff grid -->
             <div class="split-diff" role="table" aria-label="Side-by-side diff">
-              {#each splitRows as row, i (i)}
+              <div
+                class="split-pane"
+                bind:this={beforePane}
+                aria-label="Before file content"
+                onscroll={() => syncSplitScroll("before")}
+              >
+                <div class="split-pane-grid">
+                  {#each splitRows as row, i (`left-${i}`)}
                     {#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-divider"></div>
+                    {/if}
+                  {/each}
+                </div>
+              </div>
+              <div
+                class="split-pane"
+                bind:this={afterPane}
+                aria-label="After file content"
+                onscroll={() => syncSplitScroll("after")}
+              >
+                <div class="split-pane-grid">
+                  {#each splitRows as row, i (`right-${i}`)}
+                    {#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>
                     {/if}
                   {/each}
                 </div>
+              </div>
+            </div>
           {/if}
         </div>
 

src/lib/components/ExplorerPanel.svelte

@@ -1,6 +1,27 @@
 <script lang="ts">
-  import { ChevronDown, ChevronRight, FileText, Folder, FolderOpen } from "@lucide/svelte";
+  import {
+    Braces,
+    ChevronDown,
+    ChevronRight,
+    CodeXml,
+    Database,
+    FileArchive,
+    FileAudio,
+    FileCode,
+    FileCog,
+    FileImage,
+    FileJson,
+    FileSpreadsheet,
+    FileText,
+    FileType,
+    FileVideo,
+    Folder,
+    FolderOpen,
+    Terminal,
+  } from "@lucide/svelte";
+  import { languageIconForPath } from "../languageIcons";
   import type { ExplorerNode, ExplorerNodeKind, FileStatusKind, GitRepositoryFile } from "../types";
+  import LanguageIcon from "./LanguageIcon.svelte";
 
   interface Props {
     repoFiles: GitRepositoryFile[];
@@ -97,6 +118,38 @@
     return kind ?? "none";
   }
 
+  function extensionFor(path: string): string {
+    const name = path.split(/[\\/]/).pop()?.toLowerCase() ?? "";
+    const index = name.lastIndexOf(".");
+    return index > 0 ? name.slice(index + 1) : "";
+  }
+
+  function fileIconKind(node: ExplorerNode): string {
+    const name = node.name.toLowerCase();
+    const ext = extensionFor(node.path);
+
+    if (["package.json", "tsconfig.json", "jsconfig.json", "composer.json", "deno.json", "tauri.conf.json"].includes(name)) return "json";
+    if (["cargo.toml", "package-lock.json", "pnpm-lock.yaml", "yarn.lock", "bun.lockb"].includes(name)) return "config";
+    if (["dockerfile", "makefile", "justfile", "rakefile", "gemfile", ".env", ".gitignore", ".gitattributes", ".npmrc", ".editorconfig"].includes(name)) return "config";
+
+    if (["js", "jsx", "ts", "tsx", "svelte", "vue", "astro", "rs", "go", "java", "kt", "kts", "cs", "cpp", "cxx", "cc", "c", "h", "hpp", "swift", "php", "rb", "py", "lua", "dart", "scala", "zig", "ex", "exs", "erl", "hrl", "fs", "fsx", "fsi", "clj", "cljs"].includes(ext)) return "code";
+    if (["html", "htm", "xml", "xaml", "svg"].includes(ext)) return "markup";
+    if (["css", "scss", "sass", "less", "postcss"].includes(ext)) return "style";
+    if (["json", "jsonc", "json5"].includes(ext)) return "json";
+    if (["toml", "yaml", "yml", "ini", "conf", "config", "properties", "env"].includes(ext)) return "config";
+    if (["sh", "bash", "zsh", "fish", "ps1", "bat", "cmd"].includes(ext)) return "script";
+    if (["md", "mdx", "txt", "log", "rst", "adoc", "tex"].includes(ext)) return "text";
+    if (["png", "jpg", "jpeg", "gif", "webp", "bmp", "ico", "avif", "tif", "tiff"].includes(ext)) return "image";
+    if (["mp3", "wav", "ogg", "flac", "m4a", "aac"].includes(ext)) return "audio";
+    if (["mp4", "mov", "avi", "mkv", "webm", "wmv"].includes(ext)) return "video";
+    if (["zip", "rar", "7z", "tar", "gz", "tgz", "bz2", "xz"].includes(ext)) return "archive";
+    if (["csv", "tsv", "xls", "xlsx", "ods"].includes(ext)) return "sheet";
+    if (["sql", "sqlite", "sqlite3", "db"].includes(ext)) return "database";
+    if (["ttf", "otf", "woff", "woff2", "eot"].includes(ext)) return "font";
+
+    return "text";
+  }
+
   let explorerTree = $derived(buildExplorerTree(repoFiles));
   let visibleNodes = $derived(flattenExplorerTree(explorerTree, expandedExplorerPaths));
 </script>
@@ -145,7 +198,39 @@
             {/if}
           {:else}
             <span class="tree-spacer"></span>
-            <FileText size={15} aria-hidden="true" />
+            {@const languageIcon = languageIconForPath(node.path)}
+            {@const iconKind = fileIconKind(node)}
+            {#if languageIcon}
+              <LanguageIcon icon={languageIcon.icon} title={languageIcon.title} />
+            {:else if iconKind === "code"}
+              <FileCode class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "markup"}
+              <CodeXml class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "style"}
+              <Braces class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "json"}
+              <FileJson class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "config"}
+              <FileCog class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "script"}
+              <Terminal class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "image"}
+              <FileImage class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "audio"}
+              <FileAudio class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "video"}
+              <FileVideo class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "archive"}
+              <FileArchive class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "sheet"}
+              <FileSpreadsheet class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "database"}
+              <Database class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else if iconKind === "font"}
+              <FileType class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {:else}
+              <FileText class={`file-icon ${iconKind}`} size={15} aria-hidden="true" />
+            {/if}
           {/if}
 
           <button

src/lib/components/LanguageIcon.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+  import type { SimpleIcon } from "simple-icons";
+
+  interface Props {
+    icon: SimpleIcon;
+    title: string;
+  }
+
+  let { icon, title }: Props = $props();
+</script>
+
+<svg
+  class="language-icon"
+  viewBox="0 0 24 24"
+  style={`color: #${icon.hex}`}
+  aria-hidden="true"
+  focusable="false"
+>
+  <title>{title}</title>
+  <path d={icon.path} />
+</svg>

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}
 

src/lib/languageIcons.ts

@@ -0,0 +1,207 @@
+import type { SimpleIcon } from "simple-icons";
+import {
+  siAstro,
+  siBun,
+  siC,
+  siClojure,
+  siCmake,
+  siCplusplus,
+  siCss,
+  siDart,
+  siDeno,
+  siDocker,
+  siDotnet,
+  siEditorconfig,
+  siElixir,
+  siErlang,
+  siEslint,
+  siFortran,
+  siFsharp,
+  siGit,
+  siGitignoredotio,
+  siGnubash,
+  siGo,
+  siGradle,
+  siGraphql,
+  siHaskell,
+  siHtml5,
+  siJavascript,
+  siJson,
+  siJulia,
+  siKotlin,
+  siLua,
+  siMake,
+  siMarkdown,
+  siNodedotjs,
+  siNpm,
+  siOcaml,
+  siOpenjdk,
+  siPerl,
+  siPhp,
+  siPnpm,
+  siPrettier,
+  siPython,
+  siR,
+  siReact,
+  siRuby,
+  siRust,
+  siSass,
+  siScala,
+  siShell,
+  siSqlite,
+  siSvelte,
+  siSvg,
+  siSwift,
+  siTailwindcss,
+  siTauri,
+  siTerraform,
+  siToml,
+  siTypescript,
+  siVite,
+  siVuedotjs,
+  siYaml,
+  siYarn,
+  siZig,
+  siZsh,
+} from "simple-icons";
+
+export interface LanguageIconSpec {
+  icon: SimpleIcon;
+  title: string;
+}
+
+function spec(icon: SimpleIcon, title = icon.title): LanguageIconSpec {
+  return { icon, title };
+}
+
+const fileNameIcons = new Map<string, LanguageIconSpec>([
+  ["dockerfile", spec(siDocker, "Docker")],
+  ["docker-compose.yml", spec(siDocker, "Docker Compose")],
+  ["docker-compose.yaml", spec(siDocker, "Docker Compose")],
+  ["compose.yml", spec(siDocker, "Docker Compose")],
+  ["compose.yaml", spec(siDocker, "Docker Compose")],
+  ["package.json", spec(siNodedotjs, "Node package")],
+  ["package-lock.json", spec(siNpm, "npm lockfile")],
+  ["pnpm-lock.yaml", spec(siPnpm, "pnpm lockfile")],
+  ["yarn.lock", spec(siYarn, "Yarn lockfile")],
+  ["bun.lockb", spec(siBun, "Bun lockfile")],
+  ["deno.json", spec(siDeno, "Deno")],
+  ["deno.jsonc", spec(siDeno, "Deno")],
+  ["cargo.toml", spec(siRust, "Cargo")],
+  ["cargo.lock", spec(siRust, "Cargo lockfile")],
+  ["tauri.conf.json", spec(siTauri, "Tauri")],
+  ["svelte.config.js", spec(siSvelte, "Svelte config")],
+  ["svelte.config.ts", spec(siSvelte, "Svelte config")],
+  ["vite.config.js", spec(siVite, "Vite config")],
+  ["vite.config.ts", spec(siVite, "Vite config")],
+  ["tailwind.config.js", spec(siTailwindcss, "Tailwind CSS config")],
+  ["tailwind.config.ts", spec(siTailwindcss, "Tailwind CSS config")],
+  ["eslint.config.js", spec(siEslint, "ESLint config")],
+  ["eslint.config.mjs", spec(siEslint, "ESLint config")],
+  [".eslintrc", spec(siEslint, "ESLint config")],
+  [".eslintrc.js", spec(siEslint, "ESLint config")],
+  [".eslintrc.cjs", spec(siEslint, "ESLint config")],
+  [".prettierrc", spec(siPrettier, "Prettier config")],
+  [".prettierrc.json", spec(siPrettier, "Prettier config")],
+  [".prettierrc.js", spec(siPrettier, "Prettier config")],
+  [".gitignore", spec(siGitignoredotio, "gitignore")],
+  [".gitattributes", spec(siGit, "Git attributes")],
+  [".gitmodules", spec(siGit, "Git modules")],
+  [".editorconfig", spec(siEditorconfig, "EditorConfig")],
+  ["cmakelists.txt", spec(siCmake, "CMake")],
+  ["makefile", spec(siMake, "Makefile")],
+  ["justfile", spec(siShell, "Justfile")],
+  ["rakefile", spec(siRuby, "Rakefile")],
+  ["gemfile", spec(siRuby, "Gemfile")],
+]);
+
+const extensionIcons = new Map<string, LanguageIconSpec>([
+  ["js", spec(siJavascript)],
+  ["mjs", spec(siJavascript)],
+  ["cjs", spec(siJavascript)],
+  ["jsx", spec(siReact, "React JSX")],
+  ["ts", spec(siTypescript)],
+  ["mts", spec(siTypescript)],
+  ["cts", spec(siTypescript)],
+  ["tsx", spec(siReact, "React TSX")],
+  ["svelte", spec(siSvelte)],
+  ["vue", spec(siVuedotjs, "Vue")],
+  ["astro", spec(siAstro)],
+  ["rs", spec(siRust)],
+  ["go", spec(siGo)],
+  ["py", spec(siPython)],
+  ["pyw", spec(siPython)],
+  ["java", spec(siOpenjdk, "Java")],
+  ["kt", spec(siKotlin)],
+  ["kts", spec(siKotlin)],
+  ["cs", spec(siDotnet, "C#")],
+  ["cpp", spec(siCplusplus, "C++")],
+  ["cxx", spec(siCplusplus, "C++")],
+  ["cc", spec(siCplusplus, "C++")],
+  ["hpp", spec(siCplusplus, "C++")],
+  ["hh", spec(siCplusplus, "C++")],
+  ["c", spec(siC)],
+  ["h", spec(siC)],
+  ["swift", spec(siSwift)],
+  ["php", spec(siPhp, "PHP")],
+  ["rb", spec(siRuby)],
+  ["lua", spec(siLua)],
+  ["dart", spec(siDart)],
+  ["scala", spec(siScala)],
+  ["zig", spec(siZig)],
+  ["ex", spec(siElixir)],
+  ["exs", spec(siElixir)],
+  ["erl", spec(siErlang)],
+  ["hrl", spec(siErlang)],
+  ["fs", spec(siFsharp, "F#")],
+  ["fsx", spec(siFsharp, "F#")],
+  ["fsi", spec(siFsharp, "F#")],
+  ["clj", spec(siClojure)],
+  ["cljs", spec(siClojure)],
+  ["hs", spec(siHaskell)],
+  ["lhs", spec(siHaskell)],
+  ["ml", spec(siOcaml, "OCaml")],
+  ["mli", spec(siOcaml, "OCaml")],
+  ["jl", spec(siJulia)],
+  ["r", spec(siR, "R")],
+  ["pl", spec(siPerl)],
+  ["pm", spec(siPerl)],
+  ["f", spec(siFortran)],
+  ["f90", spec(siFortran)],
+  ["f95", spec(siFortran)],
+  ["html", spec(siHtml5, "HTML")],
+  ["htm", spec(siHtml5, "HTML")],
+  ["css", spec(siCss, "CSS")],
+  ["scss", spec(siSass, "Sass")],
+  ["sass", spec(siSass, "Sass")],
+  ["svg", spec(siSvg, "SVG")],
+  ["json", spec(siJson, "JSON")],
+  ["jsonc", spec(siJson, "JSONC")],
+  ["json5", spec(siJson, "JSON5")],
+  ["yaml", spec(siYaml, "YAML")],
+  ["yml", spec(siYaml, "YAML")],
+  ["toml", spec(siToml, "TOML")],
+  ["tf", spec(siTerraform, "Terraform")],
+  ["tfvars", spec(siTerraform, "Terraform variables")],
+  ["graphql", spec(siGraphql, "GraphQL")],
+  ["gql", spec(siGraphql, "GraphQL")],
+  ["md", spec(siMarkdown, "Markdown")],
+  ["mdx", spec(siMarkdown, "MDX")],
+  ["sh", spec(siGnubash, "Shell script")],
+  ["bash", spec(siGnubash, "Bash")],
+  ["zsh", spec(siZsh, "Zsh")],
+  ["fish", spec(siShell, "Fish shell")],
+  ["sql", spec(siSqlite, "SQL")],
+  ["sqlite", spec(siSqlite, "SQLite")],
+  ["sqlite3", spec(siSqlite, "SQLite")],
+]);
+
+export function languageIconForPath(path: string): LanguageIconSpec | null {
+  const name = path.split(/[\\/]/).pop()?.toLowerCase() ?? "";
+  const byName = fileNameIcons.get(name);
+  if (byName) return byName;
+
+  const index = name.lastIndexOf(".");
+  if (index <= 0) return null;
+  return extensionIcons.get(name.slice(index + 1)) ?? null;
+}

tsconfig.node.json

@@ -3,6 +3,7 @@
     "composite": true,
     "module": "ESNext",
     "moduleResolution": "bundler",
+    "skipLibCheck": true,
     "strict": true,
     "target": "ES2020",
     "verbatimModuleSyntax": true