@youtyan/code-viewer 0.9.0 → 0.9.1

package/README.md

@@ -186,8 +186,24 @@ tree state survives navigation and refresh.
 Symlinks get a distinct icon and a "→ target" label instead of looking like a
 regular file, and clicking one navigates straight to its resolved target.
 Broken symlinks are flagged and disabled instead of erroring out. Files with
-pending git changes (new, modified, renamed, deleted) show a status badge in
-the tree in place of the regular type icon.
+pending git changes show a status badge in the tree in place of the regular
+type icon:
+
+| Badge | Meaning |
+|---|---|
+| `M` | Modified |
+| `A` | Added — staged for commit |
+| `D` | Deleted |
+| `R` | Renamed |
+| `U` | Untracked — in the worktree, not under version control yet |
+| `I` | Ignored — excluded by a `.gitignore` rule |
+
+`U` and `A` are deliberately separate: a file you have never run `git add` on
+reads differently from one already staged. A directory that is wholly
+untracked or ignored is badged as a whole, so it stays recognizable while
+collapsed; it keeps its folder icon and carries the badge next to its name.
+Inside an untracked directory the badge is inherited by its contents, except
+where an ignore rule names a file specifically.
 
 ## Uploads and Scope Settings
 

package/dist/code-viewer.js

@@ -1167,8 +1167,12 @@ function runBytesAsync(args, cwd, options = {}) {
   return new Promise((resolve) => {
     const proc = spawn(args[0], args.slice(1), {
       cwd,
-      stdio: ["ignore", "pipe", "pipe"]
+      stdio: [options.stdin === undefined ? "ignore" : "pipe", "pipe", "pipe"]
     });
+    if (options.stdin !== undefined) {
+      proc.stdin?.on("error", () => {});
+      proc.stdin?.end(options.stdin);
+    }
     const stdoutChunks = [];
     const stderrChunks = [];
     let stdoutBytes = 0;
@@ -1448,9 +1452,10 @@ function run(args, cwd) {
     timeout: GIT_COMMAND_TIMEOUT_MS
   });
 }
-function runGitAsync(args, cwd) {
+function runGitAsync(args, cwd, options = {}) {
   return runAsync(resolveGitArgs(args), cwd, {
-    timeout: GIT_COMMAND_TIMEOUT_MS
+    timeout: GIT_COMMAND_TIMEOUT_MS,
+    ...options
   });
 }
 function resolveGitArgs(args) {
@@ -1530,7 +1535,7 @@ async function repoStatusMapAsync(cwd, now = Date.now()) {
     "status",
     "--porcelain=v1",
     "-z",
-    "--untracked-files=all"
+    "--untracked-files=normal"
   ], cwd);
   if (res.code !== 0)
     return map;
@@ -1542,7 +1547,7 @@ async function repoStatusMapAsync(cwd, now = Date.now()) {
     if (!path)
       continue;
     if (xy === "??") {
-      map.set(path, "A");
+      map.set(path, "U");
       continue;
     }
     if (xy[0] === "R" || xy[0] === "C" || xy[1] === "R" || xy[1] === "C") {
@@ -1557,6 +1562,27 @@ async function repoStatusMapAsync(cwd, now = Date.now()) {
   setTimedCacheEntry(repoStatusMapCache, cwd, { map }, now);
   return map;
 }
+function repoStatusForPath(map, path) {
+  const own = map.get(path) ?? map.get(`${path}/`);
+  if (own)
+    return { code: own, inherited: false };
+  for (let slash = path.lastIndexOf("/");slash > 0; slash = path.lastIndexOf("/", slash - 1)) {
+    const ancestor = map.get(`${path.slice(0, slash)}/`);
+    if (ancestor)
+      return { code: ancestor, inherited: true };
+  }
+  return;
+}
+async function ignoredPathsAsync(paths, cwd) {
+  if (!paths.length)
+    return new Set;
+  const res = await runGitAsync(["git", "check-ignore", "-z", "--stdin"], cwd, {
+    stdin: paths.join("\x00")
+  });
+  if (res.code !== 0 && res.code !== 1)
+    return new Set;
+  return new Set(res.stdout.split("\x00").filter(Boolean));
+}
 function showAsync(ref, path, cwd) {
   return runGitAsync(["git", "show", `${ref}:${path}`], cwd);
 }
@@ -25750,9 +25776,14 @@ async function handleTree(url) {
   if (tree.error)
     return text(tree.error, tree.status ?? 500);
   const entries = tree.entries.filter((entry) => !isExcludedScopePath(entry.path, excludeNames));
-  const statusMap = target === "worktree" || target === "" ? await repoStatusMapAsync(cwd) : null;
+  const worktreeTarget = target === "worktree" || target === "";
+  const [statusMap, ignoredPaths] = worktreeTarget ? await Promise.all([
+    repoStatusMapAsync(cwd),
+    ignoredPathsAsync(entries.map((entry) => entry.path), cwd)
+  ]) : [null, null];
   const withStatus = (entry) => {
-    const status = statusMap?.get(entry.path);
+    const found = statusMap && repoStatusForPath(statusMap, entry.path);
+    const status = ignoredPaths?.has(entry.path) && (!found || found.inherited) ? "I" : found?.code;
     return status ? { ...entry, status } : entry;
   };
   const deletedEntries = !recursive && statusMap ? deletedTreeEntriesForPath(statusMap, path) : [];
@@ -25766,7 +25797,7 @@ async function handleTree(url) {
       ...deletedEntries
     ],
     readme: await readReadme(target, path),
-    upload_enabled: uploadEnabled && (target === "worktree" || target === "")
+    upload_enabled: uploadEnabled && worktreeTarget
   });
 }
 async function handleSettings() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@youtyan/code-viewer",
-  "version": "0.9.0",
+  "version": "0.9.1",
   "description": "Local browser-based code and git diff viewer",
   "type": "module",
   "bin": {

package/web/app.js

@@ -23348,7 +23348,14 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
       const span = document.createElement("span");
       span.className = `badge ${ch}`;
       span.textContent = ch;
-      span.title = { M: "modified", A: "added", D: "deleted", R: "renamed" }[ch] || ch;
+      span.title = {
+        M: "modified",
+        A: "added",
+        D: "deleted",
+        R: "renamed",
+        U: "untracked",
+        I: "ignored"
+      }[ch] || ch;
       return span;
     }
     function setFileViewed(path, viewed) {
@@ -26425,7 +26432,11 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
                 },
                 {
                   kind: "paragraph",
-                  text: 'Symlinks show a distinct icon and a "→ target" label so they are never mistaken for a regular file or folder, and clicking one navigates to its resolved target. A broken symlink is visually flagged and disabled. Files with pending git changes (new, modified, renamed, deleted) show a status badge in the tree instead of the regular type icon.'
+                  text: 'Symlinks show a distinct icon and a "→ target" label so they are never mistaken for a regular file or folder, and clicking one navigates to its resolved target. A broken symlink is visually flagged and disabled.'
+                },
+                {
+                  kind: "paragraph",
+                  text: "Files with pending git changes show a status badge in the tree instead of the regular type icon: M (modified), A (added — staged for commit), D (deleted), R (renamed), U (untracked — in the worktree but not under version control yet), and I (ignored by a .gitignore rule). U and A stay separate so a file you have never run git add on does not look like one that is already staged. A wholly untracked or ignored directory is badged as a whole and keeps its folder icon, so it stays recognizable while collapsed; its contents inherit the badge unless an ignore rule names a file specifically."
                 }
               ]
             },
@@ -27116,7 +27127,11 @@ code-viewer query agent-help`
                 },
                 {
                   kind: "paragraph",
-                  text: "シンボリックリンクは専用アイコンと「→ リンク先」ラベルで表示されるため通常のファイル/フォルダと区別でき、クリックするとリンク先に遷移します。リンク切れのシンボリックリンクは無効化されたことが分かる表示になります。未コミットの git 変更(新規・変更・リネーム・削除)があるファイルは、通常の種類アイコンの代わりにステータスバッジがツリーに表示されます。"
+                  text: "シンボリックリンクは専用アイコンと「→ リンク先」ラベルで表示されるため通常のファイル/フォルダと区別でき、クリックするとリンク先に遷移します。リンク切れのシンボリックリンクは無効化されたことが分かる表示になります。"
+                },
+                {
+                  kind: "paragraph",
+                  text: "git の状態があるファイルは、通常の種類アイコンの代わりにステータスバッジがツリーに表示されます。M(変更)、A(追加 — コミット予定としてステージ済み)、D(削除)、R(リネーム)、U(未追跡 — ワークツリーにあるがまだバージョン管理下にない)、I(.gitignore の対象) の 6 種類です。U と A を分けているのは、git add をまだ一度もしていないファイルが、既にステージ済みのファイルと同じ見た目にならないようにするためです。丸ごと未追跡・無視のディレクトリにはディレクトリ単位でバッジが付き、フォルダアイコンは残るので折りたたんだままでも判別できます。配下のファイルはそのバッジを引き継ぎますが、無視ルールが個別に名指ししているファイルはそちらが優先されます。"
                 }
               ]
             },
@@ -31235,6 +31250,43 @@ code-viewer query agent-help`
     function toggleSidebarHidden() {
       applySidebarHidden(!STATE.sidebarHidden);
     }
+    function applyDirEntryToNode(node, entry) {
+      node.explicit = true;
+      if (entry.children_omitted === true) {
+        node.children_omitted = true;
+        node.children_omitted_reason = entry.children_omitted_reason;
+      }
+      if (entry.is_symlink) {
+        node.is_symlink = true;
+        node.symlink_target = entry.symlink_target;
+        node.resolved_path = entry.resolved_path;
+      }
+      if (entry.status)
+        node.status = entry.status;
+    }
+    function createTreeDirLabel(dir) {
+      const label = document.createElement("span");
+      label.className = "dir-label";
+      const dn = document.createElement("span");
+      dn.className = "dir-name";
+      dn.textContent = dir.name;
+      dn.title = dir.path;
+      label.appendChild(dn);
+      if (dir.status)
+        label.appendChild(fileBadge(dir.status));
+      if (dir.children_omitted) {
+        const omitted = document.createElement("span");
+        omitted.className = "dir-omitted " + (dir.children_omitted_reason === "heavy" ? "dir-omitted-heavy" : "dir-omitted-internal");
+        const badge = omittedDirectoryBadge(dir.children_omitted_reason);
+        omitted.textContent = badge.label;
+        omitted.title = badge.title;
+        label.appendChild(omitted);
+      }
+      const dirSymlinkLabel = symlinkTargetLabel(dir);
+      if (dirSymlinkLabel)
+        label.appendChild(dirSymlinkLabel);
+      return label;
+    }
     function buildTree(files) {
       const root = {
         name: "",
@@ -31266,16 +31318,7 @@ code-viewer query agent-help`
             node.minOrder = f2.order;
         }
         if (f2.type === "tree") {
-          node.explicit = true;
-          if (f2.children_omitted === true) {
-            node.children_omitted = true;
-            node.children_omitted_reason = f2.children_omitted_reason;
-          }
-          if (f2.is_symlink) {
-            node.is_symlink = true;
-            node.symlink_target = f2.symlink_target;
-            node.resolved_path = f2.resolved_path;
-          }
+          applyDirEntryToNode(node, f2);
           continue;
         }
         node.files.push(f2);
@@ -31345,25 +31388,7 @@ code-viewer query agent-help`
           const dirIcon = document.createElement("span");
           dirIcon.className = "dir-icon";
           li.appendChild(dirIcon);
-          const label = document.createElement("span");
-          label.className = "dir-label";
-          const dn = document.createElement("span");
-          dn.className = "dir-name";
-          dn.textContent = dir.name;
-          dn.title = dir.path;
-          label.appendChild(dn);
-          if (dir.children_omitted) {
-            const omitted = document.createElement("span");
-            omitted.className = "dir-omitted " + (dir.children_omitted_reason === "heavy" ? "dir-omitted-heavy" : "dir-omitted-internal");
-            const badge = omittedDirectoryBadge(dir.children_omitted_reason);
-            omitted.textContent = badge.label;
-            omitted.title = badge.title;
-            label.appendChild(omitted);
-          }
-          const dirSymlinkLabel = symlinkTargetLabel(dir);
-          if (dirSymlinkLabel)
-            label.appendChild(dirSymlinkLabel);
-          li.appendChild(label);
+          li.appendChild(createTreeDirLabel(dir));
           li.appendChild(createOpenPathButton(dir.path, "directory", openDirectoryInOsTitle()));
           const collapsed = STATE.collapsedDirs.has(dir.path);
           if (collapsed)
@@ -31460,16 +31485,7 @@ code-viewer query agent-help`
         node.minOrder = Math.min(node.minOrder, order);
       }
       if (entry.type === "tree") {
-        node.explicit = true;
-        if (entry.children_omitted === true) {
-          node.children_omitted = true;
-          node.children_omitted_reason = entry.children_omitted_reason;
-        }
-        if (entry.is_symlink) {
-          node.is_symlink = true;
-          node.symlink_target = entry.symlink_target;
-          node.resolved_path = entry.resolved_path;
-        }
+        applyDirEntryToNode(node, entry);
         return;
       }
       if (!node.files.some((file) => file.path === entry.path))
@@ -31553,25 +31569,7 @@ code-viewer query agent-help`
       const dirIcon = document.createElement("span");
       dirIcon.className = "dir-icon";
       li.appendChild(dirIcon);
-      const label = document.createElement("span");
-      label.className = "dir-label";
-      const dn = document.createElement("span");
-      dn.className = "dir-name";
-      dn.textContent = dir.name;
-      dn.title = dir.path;
-      label.appendChild(dn);
-      if (dir.children_omitted) {
-        const omitted = document.createElement("span");
-        omitted.className = "dir-omitted " + (dir.children_omitted_reason === "heavy" ? "dir-omitted-heavy" : "dir-omitted-internal");
-        const badge = omittedDirectoryBadge(dir.children_omitted_reason);
-        omitted.textContent = badge.label;
-        omitted.title = badge.title;
-        label.appendChild(omitted);
-      }
-      const dirSymlinkLabel = symlinkTargetLabel(dir);
-      if (dirSymlinkLabel)
-        label.appendChild(dirSymlinkLabel);
-      li.appendChild(label);
+      li.appendChild(createTreeDirLabel(dir));
       li.appendChild(createOpenPathButton(dir.path, "directory", openDirectoryInOsTitle()));
       const updateIcon = () => {
         setFolderIcon(dirIcon, li.classList.contains("collapsed"));
@@ -33209,10 +33207,17 @@ code-viewer query agent-help`
           row.className = nonBrowsableCommit ? `gdp-repo-row ${entry.type} gdp-repo-row-gitlink` : entry.is_symlink ? `gdp-repo-row ${entry.type} symlink-row${brokenSymlink ? " symlink-broken-row gdp-row-disabled" : ""}` : `gdp-repo-row ${entry.type}`;
           if (deletedEntry)
             row.classList.add("gdp-row-disabled");
-          const icon = entry.status ? fileBadge(entry.status) : repoEntryTypeIcon(entry, browsable, nonBrowsableCommit);
+          const directoryRow = entry.type === "tree";
+          const icon = entry.status && !directoryRow ? fileBadge(entry.status) : repoEntryTypeIcon(entry, browsable, nonBrowsableCommit);
           const name = document.createElement("span");
           name.className = "name";
           name.textContent = entry.name;
+          let nameCell = name;
+          if (directoryRow && entry.status) {
+            nameCell = document.createElement("span");
+            nameCell.className = "name-cell";
+            nameCell.append(name, fileBadge(entry.status));
+          }
           if (nonBrowsableCommit) {
             row.title = commitEntryMeta(entry.submodule).title;
             row.setAttribute("aria-disabled", "true");
@@ -33221,7 +33226,7 @@ code-viewer query agent-help`
           }
           const metaBlock = createRepoEntryMeta(entry, browsable);
           const size = createRepoEntrySize(entry);
-          row.append(icon, name, metaBlock, size);
+          row.append(icon, nameCell, metaBlock, size);
           row.addEventListener("click", () => {
             if (brokenSymlink || deletedEntry)
               return;

package/web/style.css

@@ -2721,11 +2721,19 @@ body.gdp-help-page #content {
 .badge.A { background: #ccffd866; color: var(--success); }
 .badge.D { background: #ffd7d566; color: var(--danger); }
 .badge.R { background: #d8b9ff66; color: var(--done); }
+/* Outside version control. U (untracked) takes the accent hue so it reads as
+   "not in git yet" rather than as one more shade of the staged-green A it
+   used to be collapsed into. I (ignored) stays deliberately colorless: an
+   ignored file is present but irrelevant to the repository. */
+.badge.U { background: var(--accent-subtle); color: var(--accent); }
+.badge.I { background: var(--bg-emph); color: var(--fg-muted); }
 
 [data-theme="dark"] .badge.M { background: rgba(210,153,34,0.20); color: var(--attn); }
 [data-theme="dark"] .badge.A { background: rgba(46,160,67,0.20); color: var(--success); }
 [data-theme="dark"] .badge.D { background: rgba(248,81,73,0.20); color: var(--danger); }
 [data-theme="dark"] .badge.R { background: rgba(163,113,247,0.20); color: var(--done); }
+[data-theme="dark"] .badge.U { background: rgba(56,139,253,0.20); color: var(--accent); }
+[data-theme="dark"] .badge.I { background: rgba(145,152,161,0.15); color: var(--fg-muted); }
 
 /* Sidebar row marker for files worth a second look before diving in:
    heavy diffs, binary/media files, or Git commit entries. Same semantics as
@@ -4792,6 +4800,16 @@ body.gdp-file-detail-page #empty {
   white-space: nowrap;
   font-weight: 500;
 }
+/* Holds the name plus a directory's status badge inside the single name
+   column of the row grid - same shape as the sidebar's .dir-label, which
+   pairs a directory name with its badges. */
+.gdp-repo-row .name-cell {
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  overflow: hidden;
+}
 .gdp-repo-row .kind {
   justify-self: end;
   color: var(--fg-muted);