@youtyan/code-viewer 0.8.1 → 0.8.2

package/README.md

@@ -178,7 +178,9 @@ files or directory names completely.
 
 Scope settings control directory exclusions shared by the sidebar, Ctrl+K file
 palette, Ctrl+G grep palette, the Datastores browser, and the file change
-watcher — the same list applies to all five. Everything you change in Viewer
+watcher — the same list applies to all five. Both the skip list and the hide
+list accept gitignore-style wildcards (`*`, `?`, `[abc]`, `[!abc]`) in
+addition to exact names. Everything you change in Viewer
 Settings is saved on the server under `.code-viewer/settings.json` (no
 separate project-level config file). `.DS_Store` and a broad set of
 build/cache directories (`node_modules`, `dist`, `build`, `.next`, `.turbo`,
@@ -249,9 +251,10 @@ concurrency via `_seq_no` / `_primary_term`), create new documents, and delete
 existing ones. Snapshots and diffs over `_search` iteration are supported.
 
 **DynamoDB** support: detect LocalStack services with DynamoDB enabled, list
-tables across paginated responses, inspect key schemas, scan or query items,
-page with `LastEvaluatedKey`, and open an item detail view with a copyable key.
-The explorer is read-only.
+tables across paginated responses, and browse a Structure tab (key schema,
+global/local secondary indexes, and non-key attribute types inferred from
+loaded items) alongside scan or query items, `LastEvaluatedKey` pagination,
+and an item detail view with a copyable key. The explorer is read-only.
 
 **S3-compatible object storage** (MinIO, LocalStack): browse
 buckets as a folder tree, search by prefix or filename, sort scanned objects by

package/dist/code-viewer.js

@@ -835,6 +835,110 @@ var init_command_resolver = __esm(() => {
   activeOverrides = new Map;
 });
 
+// web-src/server/name-pattern.ts
+function parseGlobSegment(pattern) {
+  const matchers = [];
+  for (let i = 0;i < pattern.length; i++) {
+    const ch = pattern[i];
+    if (ch === "*") {
+      matchers.push({ kind: "star" });
+    } else if (ch === "?") {
+      matchers.push({ kind: "any" });
+    } else if (ch === "[") {
+      const close = pattern.indexOf("]", i + 1);
+      if (close === -1) {
+        matchers.push({ kind: "literal", ch: "[" });
+        continue;
+      }
+      const rawBody = pattern.slice(i + 1, close);
+      const negate = rawBody.startsWith("!");
+      matchers.push({
+        kind: "class",
+        body: negate ? rawBody.slice(1) : rawBody,
+        negate
+      });
+      i = close;
+    } else {
+      matchers.push({ kind: "literal", ch });
+    }
+  }
+  return matchers;
+}
+function charInClassBody(ch, body) {
+  for (let i = 0;i < body.length; ) {
+    if (body[i + 1] === "-" && i + 2 < body.length) {
+      if (ch >= body[i] && ch <= body[i + 2])
+        return true;
+      i += 3;
+    } else {
+      if (ch === body[i])
+        return true;
+      i += 1;
+    }
+  }
+  return false;
+}
+function matchesAt(matcher, ch) {
+  switch (matcher.kind) {
+    case "literal":
+      return matcher.ch === ch;
+    case "any":
+      return true;
+    case "class":
+      return charInClassBody(ch, matcher.body) !== matcher.negate;
+    case "star":
+      return false;
+  }
+}
+function matchGlobSegment(matchers, name) {
+  let mi = 0;
+  let ni = 0;
+  let starMi = -1;
+  let starNi = -1;
+  while (ni < name.length) {
+    const matcher = matchers[mi];
+    if (matcher && matcher.kind === "star") {
+      starMi = mi;
+      starNi = ni;
+      mi++;
+    } else if (matcher && matchesAt(matcher, name[ni])) {
+      mi++;
+      ni++;
+    } else if (starMi !== -1) {
+      mi = starMi + 1;
+      starNi++;
+      ni = starNi;
+    } else {
+      return false;
+    }
+  }
+  while (matchers[mi]?.kind === "star")
+    mi++;
+  return mi === matchers.length;
+}
+function compileNamePatterns(patterns) {
+  const literals = new Set;
+  const globs = [];
+  for (const pattern of patterns) {
+    const lower = pattern.toLowerCase();
+    if (GLOB_CHARS.test(lower)) {
+      globs.push(parseGlobSegment(lower));
+    } else {
+      literals.add(lower);
+    }
+  }
+  return {
+    matches(name) {
+      const lower = name.toLowerCase();
+      return literals.has(lower) || globs.some((matchers) => matchGlobSegment(matchers, lower));
+    }
+  };
+}
+var GLOB_CHARS;
+var init_name_pattern = __esm(() => {
+  GLOB_CHARS = /[*?[\]]/;
+});
+
 // web-src/server/runtime.ts
 import { spawn, spawnSync } from "node:child_process";
 import { createReadStream, promises as fs } from "node:fs";
@@ -2110,7 +2214,7 @@ function sortTreeEntries(entries) {
 function omittedWorktreeDirectoryReason(name, omitDirNames) {
   if (name === ".git")
     return "internal";
-  return omitDirNames.has(name) ? "heavy" : undefined;
+  return omitDirNames.matches(name) ? "heavy" : undefined;
 }
 function worktreeSubmodulePaths(cwd) {
   if (!existsSync(join3(cwd, ".gitmodules")))
@@ -2137,7 +2241,7 @@ async function worktreeSubmodulePathsAsync(cwd) {
   }).filter(Boolean));
 }
 function worktreeEntryFromDirent(base, dir, name, isDirectory, omitDirNames, excludeNames, submodulePaths) {
-  if (excludeNames.has(name.toLowerCase()))
+  if (excludeNames.matches(name))
     return {
       name,
       path: "",
@@ -2157,8 +2261,8 @@ function worktreeEntryFromDirent(base, dir, name, isDirectory, omitDirNames, exc
 function worktreeFilesystemEntries(cwd, path, recursive, omitDirNames = DEFAULT_WORKTREE_OMIT_DIR_NAMES, excludeNames = []) {
   const base = normalizeTreePath(path);
   const root = join3(cwd, base);
-  const omitDirNameSet = new Set(omitDirNames);
-  const excludeNameSet = new Set(excludeNames.map((name) => name.toLowerCase()));
+  const omitDirNameSet = compileNamePatterns(omitDirNames);
+  const excludeNameSet = compileNamePatterns(excludeNames);
   const submodulePaths = worktreeSubmodulePaths(cwd);
   let directEntries;
   try {
@@ -2200,7 +2304,7 @@ function worktreeFilesystemEntries(cwd, path, recursive, omitDirNames = DEFAULT_
       return;
     }
     for (const entry of entries) {
-      if (excludeNameSet.has(entry.name.toLowerCase()))
+      if (excludeNameSet.matches(entry.name))
         continue;
       const entryPath = prefix ? `${prefix}/${entry.name}` : entry.name;
       const full = join3(dir, entry.name);
@@ -2236,8 +2340,8 @@ function worktreeFilesystemEntries(cwd, path, recursive, omitDirNames = DEFAULT_
 async function worktreeFilesystemEntriesAsync(cwd, path, recursive, omitDirNames = DEFAULT_WORKTREE_OMIT_DIR_NAMES, excludeNames = []) {
   const base = normalizeTreePath(path);
   const root = join3(cwd, base);
-  const omitDirNameSet = new Set(omitDirNames);
-  const excludeNameSet = new Set(excludeNames.map((name) => name.toLowerCase()));
+  const omitDirNameSet = compileNamePatterns(omitDirNames);
+  const excludeNameSet = compileNamePatterns(excludeNames);
   const submodulePaths = await worktreeSubmodulePathsAsync(cwd);
   let directEntries;
   try {
@@ -2287,7 +2391,7 @@ async function worktreeFilesystemEntriesAsync(cwd, path, recursive, omitDirNames
       return;
     }
     for (const entry of entries) {
-      if (excludeNameSet.has(entry.name.toLowerCase()))
+      if (excludeNameSet.matches(entry.name))
         continue;
       const entryPath = prefix ? `${prefix}/${entry.name}` : entry.name;
       const full = join3(dir, entry.name);
@@ -2726,6 +2830,7 @@ function truncateToNHunks(diffText, n, maxLines = Number.POSITIVE_INFINITY) {
 var BLAME_ZERO_SHA = "0000000000000000000000000000000000000000", WORKTREE_RECURSIVE_DEPTH_LIMIT = 32, WORKTREE_RECURSIVE_ENTRY_LIMIT = 50000, DEFAULT_REF_COMMIT_LIMIT = 100, MAX_REF_COMMIT_LIMIT = 500, COMMIT_FORMAT = "%H%x00%s%x00%an%x00%aI", ALWAYS_WORKTREE_OMIT_DIR_NAMES, DEFAULT_WORKTREE_OMIT_DIR_NAMES, GIT_COMMAND_TIMEOUT_MS = 20000, HISTORY_FORMAT = "%H%x00%s%x00%an%x00%aI%x00%P%x00%b", MAX_HISTORY_LIMIT = 200;
 var init_git = __esm(() => {
   init_command_resolver();
+  init_name_pattern();
   init_runtime();
   ALWAYS_WORKTREE_OMIT_DIR_NAMES = [".devbox", ".direnv"];
   DEFAULT_WORKTREE_OMIT_DIR_NAMES = [
@@ -8766,11 +8871,11 @@ function normalizeGrepMax(value) {
   return Math.min(parsed, GREP_ABSOLUTE_MAX);
 }
 function isSkippableSearchPath(path, omitDirNames = [], excludeNames = []) {
-  const omitDirs = new Set(omitDirNames.map((name) => name.toLowerCase()));
-  const excluded = new Set(excludeNames.map((name) => name.toLowerCase()));
+  const omitDirs = compileNamePatterns(omitDirNames);
+  const excluded = compileNamePatterns(excludeNames);
   return path.split(/[\\/]+/).some((part) => {
     const lower = part.toLowerCase();
-    return lower === ".git" || lower === ".code-viewer" || omitDirs.has(lower) || excluded.has(lower);
+    return lower === ".git" || lower === ".code-viewer" || omitDirs.matches(part) || excluded.matches(part);
   });
 }
 function fixedStringLineMatches(path, text, query, max) {
@@ -8877,6 +8982,7 @@ function parseGitGrepOutput(stdout, ref, max, omitDirNames = [], excludeNames =
 }
 var GREP_DEFAULT_MAX = 200, GREP_ABSOLUTE_MAX = 500, GREP_MAX_FILE_BYTES, FILE_SEARCH_ABSOLUTE_MAX = 50000, DEFAULT_EXCLUDE_NAMES;
 var init_search = __esm(() => {
+  init_name_pattern();
   GREP_MAX_FILE_BYTES = 2 * 1024 * 1024;
   DEFAULT_EXCLUDE_NAMES = [".DS_Store"];
 });
@@ -23141,7 +23247,8 @@ async function rgAvailableAsync(cwd) {
   return rgAvailableCache;
 }
 function isExcludedScopePath(path, excludeNames) {
-  return path.split(/[\\/]+/).some((part) => excludeNames.some((name) => part.toLowerCase() === name.toLowerCase()));
+  const excluded = compileNamePatterns(excludeNames);
+  return path.split(/[\\/]+/).some((part) => excluded.matches(part));
 }
 function isSafePath(path) {
   if (!path || path.startsWith("/") || path.startsWith("\\") || path.includes("\x00"))
@@ -23340,6 +23447,7 @@ var init_search_service = __esm(() => {
   init_command_resolver();
   init_spawn_runner();
   init_git();
+  init_name_pattern();
   init_search();
 });
 

package/package.json

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

package/web/app.js

@@ -10480,6 +10480,80 @@ ${frontmatter.yaml}
     return true;
   }
 
+  // web-src/views/database/detail-table.ts
+  function createDetailTable(headers, rows, emptyText) {
+    const table2 = document.createElement("table");
+    table2.className = "db-detail-table";
+    const thead = document.createElement("thead");
+    const headRow = document.createElement("tr");
+    for (const label of headers) {
+      const th = document.createElement("th");
+      th.textContent = label;
+      headRow.appendChild(th);
+    }
+    thead.appendChild(headRow);
+    table2.appendChild(thead);
+    const tbody = document.createElement("tbody");
+    if (rows.length === 0) {
+      const row = document.createElement("tr");
+      const td = document.createElement("td");
+      td.colSpan = headers.length;
+      td.className = "db-value-empty";
+      td.textContent = emptyText;
+      row.appendChild(td);
+      tbody.appendChild(row);
+    }
+    for (const cells of rows) {
+      const row = document.createElement("tr");
+      cells.forEach((cellText, index) => {
+        const td = document.createElement("td");
+        td.textContent = cellText;
+        td.className = index === 0 ? "db-detail-table-primary" : "db-detail-table-muted";
+        row.appendChild(td);
+      });
+      tbody.appendChild(row);
+    }
+    table2.appendChild(tbody);
+    return table2;
+  }
+
+  // web-src/views/database/detail-tabs.ts
+  function createDetailTabs(specs, initial, onSelect) {
+    const tabsEl = document.createElement("div");
+    tabsEl.className = "db-detail-tabs";
+    const buttons = {};
+    const bodies = {};
+    let active = initial;
+    function setActive(tab) {
+      active = tab;
+      for (const spec of specs) {
+        buttons[spec.id].classList.toggle("active", spec.id === tab);
+        bodies[spec.id].hidden = spec.id !== tab;
+      }
+    }
+    for (const spec of specs) {
+      const btn = document.createElement("button");
+      btn.type = "button";
+      btn.className = "db-detail-tab";
+      btn.textContent = spec.label;
+      btn.addEventListener("click", () => {
+        setActive(spec.id);
+        onSelect(spec.id);
+      });
+      buttons[spec.id] = btn;
+      tabsEl.appendChild(btn);
+      const body = document.createElement("div");
+      body.className = "db-detail-tab-body";
+      bodies[spec.id] = body;
+    }
+    setActive(initial);
+    function setLabels(labels) {
+      for (const spec of specs)
+        buttons[spec.id].textContent = labels[spec.id];
+    }
+    return { tabsEl, bodies, getActive: () => active, setActive, setLabels };
+  }
+
   // web-src/views/database/i18n.ts
   var EN = {
     nav: {
@@ -10820,7 +10894,21 @@ ${frontmatter.yaml}
         copied: "Copied",
         copyFailed: "Copy failed",
         invalidAttributeValues: "Invalid attribute values JSON",
-        runQuery: "Run"
+        runQuery: "Run",
+        structureTab: "Structure",
+        itemTab: "Item",
+        selectTable: "Select a table to view its structure.",
+        attributeHeader: "Attribute",
+        typeHeader: "Type",
+        keyRoleHeader: "Key",
+        noAttributes: "(no attributes)",
+        globalSecondaryIndexes: "Global secondary indexes",
+        localSecondaryIndexes: "Local secondary indexes",
+        projectionAll: "ALL",
+        projectionKeysOnly: "KEYS_ONLY",
+        projectionInclude: (attrs) => `INCLUDE (${attrs})`,
+        keySchemaOnlyHint: "DynamoDB only enforces types for key attributes. Additional attributes will appear here once items are loaded.",
+        inferredAttributesNote: (count) => `Attributes beyond the key schema are inferred from ${count.toLocaleString()} loaded item${count === 1 ? "" : "s"} and may not reflect every item.`
       }
     }
   };
@@ -11163,7 +11251,21 @@ ${frontmatter.yaml}
         copied: "コピーしました",
         copyFailed: "コピーに失敗しました",
         invalidAttributeValues: "属性値の JSON が不正です",
-        runQuery: "実行"
+        runQuery: "実行",
+        structureTab: "構造",
+        itemTab: "アイテム",
+        selectTable: "テーブルを選択すると構造が表示されます。",
+        attributeHeader: "属性",
+        typeHeader: "型",
+        keyRoleHeader: "キー",
+        noAttributes: "(属性がありません)",
+        globalSecondaryIndexes: "グローバルセカンダリインデックス",
+        localSecondaryIndexes: "ローカルセカンダリインデックス",
+        projectionAll: "ALL",
+        projectionKeysOnly: "KEYS_ONLY",
+        projectionInclude: (attrs) => `INCLUDE (${attrs})`,
+        keySchemaOnlyHint: "DynamoDBがスキーマとして強制するのはキー属性のみです。アイテムを読み込むと追加の属性がここに表示されます。",
+        inferredAttributesNote: (count) => `キー以外の属性は、読み込み済みの${count.toLocaleString()}件のアイテムから検出したものです (全アイテムを網羅するとは限りません)。`
       }
     }
   };
@@ -11237,6 +11339,25 @@ ${frontmatter.yaml}
       out[k] = unwrapAttributeValue(v);
     return out;
   }
+  var ATTRIBUTE_VALUE_TAG_ORDER = [
+    "S",
+    "N",
+    "B",
+    "BOOL",
+    "NULL",
+    "M",
+    "L",
+    "SS",
+    "NS",
+    "BS"
+  ];
+  function attributeValueTag(av) {
+    for (const tag of ATTRIBUTE_VALUE_TAG_ORDER) {
+      if (tag in av)
+        return tag;
+    }
+    return "?";
+  }
   function previewItem(item) {
     const entries = Object.entries(item).slice(0, 6);
     const parts = entries.map(([key, rawValue]) => {
@@ -11347,8 +11468,17 @@ ${frontmatter.yaml}
     moreBtn.hidden = true;
     itemListPane.appendChild(moreBtn);
     const detailPane = document.createElement("div");
-    detailPane.className = "dynamodb-detail-pane";
-    setPaneEmpty(detailPane, text3().dynamodb.selectItem);
+    detailPane.className = "db-detail-pane";
+    const detailTabs = createDetailTabs([
+      { id: "structure", label: text3().dynamodb.structureTab },
+      { id: "item", label: text3().dynamodb.itemTab }
+    ], "structure", () => notifySelectionChange());
+    detailPane.appendChild(detailTabs.tabsEl);
+    const structureBody = detailTabs.bodies.structure;
+    setPaneEmpty(structureBody, text3().dynamodb.selectTable);
+    const itemBody = detailTabs.bodies.item;
+    setPaneEmpty(itemBody, text3().dynamodb.selectItem);
+    detailPane.append(structureBody, itemBody);
     container.append(itemListPane, detailPane);
     let currentDbId = null;
     let currentTable = null;
@@ -11360,6 +11490,7 @@ ${frontmatter.yaml}
     let currentItemKeyToken = null;
     let cumulativeShownCount = 0;
     let cumulativeScannedCount = 0;
+    let lastRenderedItem = null;
     let disposed = false;
     let loadRunId = 0;
     let itemRunId = 0;
@@ -11384,6 +11515,9 @@ ${frontmatter.yaml}
       queryModeBtn.classList.toggle("active", mode === "query");
       keyConditionInput.hidden = mode !== "query";
     }
+    function setDetailTab(tab) {
+      detailTabs.setActive(tab);
+    }
     function renderTables(tableNames, append = false) {
       if (!append) {
         tableList.innerHTML = "";
@@ -11436,10 +11570,51 @@ ${frontmatter.yaml}
       }
       itemList.appendChild(fragment);
     }
-    function renderTableInfo() {
-      detailPane.innerHTML = "";
-      if (!currentTableInfo)
+    function projectionText(projection) {
+      const t2 = text3().dynamodb;
+      if (!projection?.ProjectionType)
+        return "";
+      if (projection.ProjectionType === "ALL")
+        return t2.projectionAll;
+      if (projection.ProjectionType === "KEYS_ONLY")
+        return t2.projectionKeysOnly;
+      return t2.projectionInclude((projection.NonKeyAttributes ?? []).join(", "));
+    }
+    function renderSecondaryIndexes(label, indexes) {
+      if (!indexes || indexes.length === 0)
         return;
+      const section = document.createElement("div");
+      section.className = "dynamodb-index-section";
+      const heading2 = document.createElement("div");
+      heading2.className = "dynamodb-index-heading";
+      heading2.textContent = label;
+      section.appendChild(heading2);
+      for (const ix of indexes) {
+        const row = document.createElement("div");
+        row.className = "dynamodb-index-row";
+        const name = document.createElement("div");
+        name.className = "dynamodb-index-name";
+        name.textContent = ix.IndexName ?? "";
+        const detail = document.createElement("div");
+        detail.className = "dynamodb-index-detail";
+        const keyPart = (ix.KeySchema ?? []).map((k) => `${k.AttributeName} (${k.KeyType})`).join(", ");
+        detail.textContent = [
+          keyPart,
+          projectionText(ix.Projection),
+          ix.ItemCount !== undefined ? `${ix.ItemCount.toLocaleString()} items` : undefined
+        ].filter(Boolean).join(" / ");
+        row.append(name, detail);
+        section.appendChild(row);
+      }
+      structureBody.appendChild(section);
+    }
+    function renderTableStructure() {
+      structureBody.innerHTML = "";
+      if (!currentTableInfo) {
+        setPaneEmpty(structureBody, text3().dynamodb.selectTable);
+        return;
+      }
+      const t2 = text3().dynamodb;
       const header = document.createElement("div");
       header.className = "dynamodb-table-info-header";
       header.textContent = currentTableInfo.TableName ?? currentTable ?? "";
@@ -11447,26 +11622,54 @@ ${frontmatter.yaml}
       meta.className = "dynamodb-table-info-meta";
       meta.textContent = [
         currentTableInfo.TableStatus,
-        currentTableInfo.ItemCount !== undefined ? `${currentTableInfo.ItemCount.toLocaleString()} items` : undefined
+        currentTableInfo.ItemCount !== undefined ? `${currentTableInfo.ItemCount.toLocaleString()} items` : undefined,
+        currentTableInfo.TableSizeBytes !== undefined ? formatBytes(currentTableInfo.TableSizeBytes) : undefined,
+        currentTableInfo.BillingModeSummary?.BillingMode
       ].filter(Boolean).join(" / ");
-      detailPane.append(header, meta);
-      const keySchema = currentTableInfo.KeySchema ?? [];
-      if (keySchema.length > 0) {
-        const keyList = document.createElement("div");
-        keyList.className = "dynamodb-table-info-keys";
-        keyList.textContent = keySchema.map((k) => `${k.AttributeName} (${k.KeyType})`).join(", ");
-        detailPane.appendChild(keyList);
-      }
-      const empty = document.createElement("div");
-      empty.className = "db-pane-empty dynamodb-table-info-empty";
-      const emptyTitle = document.createElement("div");
-      emptyTitle.className = "db-pane-empty-title";
-      emptyTitle.textContent = text3().dynamodb.selectItem;
-      empty.appendChild(emptyTitle);
-      detailPane.appendChild(empty);
+      structureBody.append(header, meta);
+      const attributeTypeByName = new Map((currentTableInfo.AttributeDefinitions ?? []).map((a2) => [
+        a2.AttributeName,
+        a2.AttributeType
+      ]));
+      const keyRoleByName = new Map((currentTableInfo.KeySchema ?? []).map((k) => [
+        k.AttributeName,
+        k.KeyType
+      ]));
+      const attrNames = [...attributeTypeByName.keys()];
+      const inferredTypesByName = new Map;
+      for (const item of itemsByKeyToken.values()) {
+        for (const [attrName, av] of Object.entries(item)) {
+          if (attributeTypeByName.has(attrName))
+            continue;
+          const set2 = inferredTypesByName.get(attrName) ?? new Set;
+          set2.add(attributeValueTag(av));
+          inferredTypesByName.set(attrName, set2);
+        }
+      }
+      const inferredNames = [...inferredTypesByName.keys()].sort();
+      const rows = [
+        ...attrNames.map((name) => [
+          name,
+          attributeTypeByName.get(name) ?? "",
+          keyRoleByName.get(name) ?? ""
+        ]),
+        ...inferredNames.map((name) => [
+          name,
+          [...inferredTypesByName.get(name) ?? []].join(", "),
+          ""
+        ])
+      ];
+      structureBody.appendChild(createDetailTable([t2.attributeHeader, t2.typeHeader, t2.keyRoleHeader], rows, t2.noAttributes));
+      const note = document.createElement("div");
+      note.className = "dynamodb-attr-note";
+      note.textContent = inferredNames.length === 0 ? t2.keySchemaOnlyHint : t2.inferredAttributesNote(itemsByKeyToken.size);
+      structureBody.appendChild(note);
+      renderSecondaryIndexes(t2.globalSecondaryIndexes, currentTableInfo.GlobalSecondaryIndexes);
+      renderSecondaryIndexes(t2.localSecondaryIndexes, currentTableInfo.LocalSecondaryIndexes);
     }
     function renderItemDetail(item) {
-      detailPane.innerHTML = "";
+      lastRenderedItem = item;
+      itemBody.innerHTML = "";
       const header = document.createElement("div");
       header.className = "dynamodb-item-detail-header";
       const title = document.createElement("span");
@@ -11489,7 +11692,7 @@ ${frontmatter.yaml}
         }
       });
       header.append(title, copyBtn, copyStatus);
-      detailPane.appendChild(header);
+      itemBody.appendChild(header);
       const pre = document.createElement("pre");
       pre.className = "dynamodb-item-source";
       try {
@@ -11497,12 +11700,13 @@ ${frontmatter.yaml}
       } catch {
         pre.textContent = String(item);
       }
-      detailPane.appendChild(pre);
+      itemBody.appendChild(pre);
     }
     function selectItem(item, token) {
       currentItemKeyToken = token ?? itemKeyToken(extractItemKey(item, currentTableInfo?.KeySchema));
       highlightActiveItem(currentItemKeyToken);
       renderItemDetail(item);
+      setDetailTab("item");
       notifySelectionChange();
     }
     async function loadItems(append) {
@@ -11538,8 +11742,6 @@ ${frontmatter.yaml}
         cumulativeShownCount = 0;
         cumulativeScannedCount = 0;
         setPaneStatus(itemList, "Loading items...");
-        if (!currentTableInfo)
-          setPaneEmpty(detailPane, text3().dynamodb.selectItem);
       }
       try {
         const params = new URLSearchParams({
@@ -11581,6 +11783,8 @@ ${frontmatter.yaml}
         } else {
           appendItems(data.items);
         }
+        if (currentTableInfo)
+          renderTableStructure();
         currentNextToken = data.lastEvaluatedKey;
         moreBtn.hidden = !data.lastEvaluatedKey;
         cumulativeShownCount += data.items.length;
@@ -11602,21 +11806,29 @@ ${frontmatter.yaml}
         return;
       const slot = tableInfoGuard.start();
       const requestDbId = currentDbId;
+      const isStaleRequest = () => disposed || slot.isStale() || requestDbId !== currentDbId || currentTable !== table2;
       try {
         const params = new URLSearchParams({ db: requestDbId, table: table2 });
         const res = await trackLoad(fetch(`/_db/dynamodb/table?${params}`, { signal: slot.signal }));
-        if (disposed || slot.isStale())
+        if (isStaleRequest())
           return;
-        if (!res.ok)
+        if (!res.ok) {
+          const errText = await res.text();
+          setPaneStatus(structureBody, `Error: ${errText || res.statusText}`, {
+            error: true
+          });
           return;
+        }
         const data = await res.json();
-        if (disposed || slot.isStale() || requestDbId !== currentDbId || currentTable !== table2) {
+        if (isStaleRequest())
           return;
-        }
         currentTableInfo = data.table;
-        if (!currentItemKeyToken)
-          renderTableInfo();
-      } catch {} finally {
+        renderTableStructure();
+      } catch (err) {
+        if (isStaleRequest())
+          return;
+        setPaneStatus(structureBody, `Error: ${err instanceof Error ? err.message : String(err)}`, { error: true });
+      } finally {
         slot.finish();
       }
     }
@@ -11656,7 +11868,14 @@ ${frontmatter.yaml}
       currentNextToken = undefined;
       highlightActiveTable(name);
       notifySelectionChange();
-      setPaneEmpty(detailPane, text3().dynamodb.selectItem);
+      lastRenderedItem = null;
+      itemsByKeyToken.clear();
+      itemRowsByKeyToken.clear();
+      structureBody.innerHTML = "";
+      setPaneStatus(structureBody, "Loading table...");
+      itemBody.innerHTML = "";
+      setPaneEmpty(itemBody, text3().dynamodb.selectItem);
+      setDetailTab("structure");
       await fetchTableInfo(name);
       await loadItems(false);
     }
@@ -11773,7 +11992,12 @@ ${frontmatter.yaml}
       activeItemRow = null;
       moreBtn.hidden = true;
       tableMoreBtn.hidden = true;
-      setPaneEmpty(detailPane, text3().dynamodb.selectItem);
+      lastRenderedItem = null;
+      structureBody.innerHTML = "";
+      setPaneEmpty(structureBody, text3().dynamodb.selectTable);
+      itemBody.innerHTML = "";
+      setPaneEmpty(itemBody, text3().dynamodb.selectItem);
+      setDetailTab("structure");
       setPaneStatus(tableList, "Loading tables...");
       try {
         const res = await trackLoad(fetch(`/_db/dynamodb/tables?db=${encodeURIComponent(dbId)}`, {
@@ -11809,6 +12033,8 @@ ${frontmatter.yaml}
               await selectItemByKey(key);
             } catch {}
           }
+          if (initial?.detailTab)
+            setDetailTab(initial.detailTab);
         } finally {
           suppressNotify = false;
         }
@@ -11854,7 +12080,12 @@ ${frontmatter.yaml}
       itemRowsByKeyToken.clear();
       activeItemRow = null;
       moreBtn.hidden = true;
-      setPaneEmpty(detailPane, text3().dynamodb.selectItem);
+      lastRenderedItem = null;
+      structureBody.innerHTML = "";
+      setPaneEmpty(structureBody, text3().dynamodb.selectTable);
+      itemBody.innerHTML = "";
+      setPaneEmpty(itemBody, text3().dynamodb.selectItem);
+      setDetailTab("structure");
     }
     setMode("scan");
     function getSelection() {
@@ -11865,7 +12096,8 @@ ${frontmatter.yaml}
         filterExpression: filterInput.value.trim() || undefined,
         expressionAttributeValues: attributeValuesInput.value.trim() || undefined,
         scanIndexForward: currentMode === "query" ? currentScanIndexForward : undefined,
-        itemKey: currentItemKeyToken ?? undefined
+        itemKey: currentItemKeyToken ?? undefined,
+        detailTab: detailTabs.getActive()
       };
     }
     function dispose() {
@@ -11883,12 +12115,18 @@ ${frontmatter.yaml}
       runBtn.textContent = t2.dynamodb.runQuery;
       tableMoreBtn.textContent = t2.common.loadMore;
       moreBtn.textContent = t2.common.loadMore;
-      if (!activeItemRow) {
-        if (currentTableInfo)
-          renderTableInfo();
-        else
-          setPaneEmpty(detailPane, t2.dynamodb.selectItem);
-      }
+      detailTabs.setLabels({
+        structure: t2.dynamodb.structureTab,
+        item: t2.dynamodb.itemTab
+      });
+      if (currentTableInfo)
+        renderTableStructure();
+      else
+        setPaneEmpty(structureBody, t2.dynamodb.selectTable);
+      if (lastRenderedItem)
+        renderItemDetail(lastRenderedItem);
+      else
+        setPaneEmpty(itemBody, t2.dynamodb.selectItem);
     }
     return {
       el: container,
@@ -11951,25 +12189,15 @@ ${frontmatter.yaml}
     docMoreBtn.hidden = true;
     docListPane.appendChild(docMoreBtn);
     const detailPane = document.createElement("div");
-    detailPane.className = "es-detail-pane";
-    const detailTabs = document.createElement("div");
-    detailTabs.className = "es-detail-tabs";
-    const tabMapping = document.createElement("button");
-    tabMapping.type = "button";
-    tabMapping.className = "es-detail-tab active";
-    tabMapping.textContent = text3().es.mapping;
-    const tabDoc = document.createElement("button");
-    tabDoc.type = "button";
-    tabDoc.className = "es-detail-tab";
-    tabDoc.textContent = text3().es.doc;
-    detailTabs.append(tabMapping, tabDoc);
-    detailPane.appendChild(detailTabs);
-    const mappingBody = document.createElement("div");
-    mappingBody.className = "es-mapping-body";
+    detailPane.className = "db-detail-pane";
+    const detailTabs = createDetailTabs([
+      { id: "mapping", label: text3().es.mapping },
+      { id: "doc", label: text3().es.doc }
+    ], "mapping", () => {});
+    detailPane.appendChild(detailTabs.tabsEl);
+    const mappingBody = detailTabs.bodies.mapping;
     setPaneEmpty(mappingBody, text3().es.selectIndex);
-    const docBody = document.createElement("div");
-    docBody.className = "es-doc-body";
-    docBody.hidden = true;
+    const docBody = detailTabs.bodies.doc;
     setPaneEmpty(docBody, text3().es.selectDoc);
     detailPane.append(mappingBody, docBody);
     container.append(docListPane, detailPane);
@@ -12094,13 +12322,8 @@ ${frontmatter.yaml}
     }
     function setDetailTab(tab) {
       detailTab = tab;
-      tabMapping.classList.toggle("active", tab === "mapping");
-      tabDoc.classList.toggle("active", tab === "doc");
-      mappingBody.hidden = tab !== "mapping";
-      docBody.hidden = tab !== "doc";
+      detailTabs.setActive(tab);
     }
-    tabMapping.addEventListener("click", () => setDetailTab("mapping"));
-    tabDoc.addEventListener("click", () => setDetailTab("doc"));
     function renderMapping(resp) {
       lastMapping = resp;
       mappingBody.innerHTML = "";
@@ -12108,43 +12331,13 @@ ${frontmatter.yaml}
       header.className = "es-mapping-header";
       header.textContent = resp.mapping.index;
       mappingBody.appendChild(header);
-      const table2 = document.createElement("table");
-      table2.className = "es-mapping-table";
-      const thead = document.createElement("thead");
-      const headRow = document.createElement("tr");
-      for (const label of [text3().es.fieldHeader, text3().es.typeHeader]) {
-        const th = document.createElement("th");
-        th.textContent = label;
-        headRow.appendChild(th);
-      }
-      thead.appendChild(headRow);
-      table2.appendChild(thead);
-      const tbody = document.createElement("tbody");
       const props = resp.mapping.properties;
       const keys = Object.keys(props).sort();
-      if (keys.length === 0) {
-        const row = document.createElement("tr");
-        const td = document.createElement("td");
-        td.colSpan = 2;
-        td.className = "es-value-empty";
-        td.textContent = text3().es.noMappedFields;
-        row.appendChild(td);
-        tbody.appendChild(row);
-      }
-      for (const key of keys) {
-        const row = document.createElement("tr");
-        const fieldTd = document.createElement("td");
-        fieldTd.className = "es-mapping-field";
-        fieldTd.textContent = key;
-        const typeTd = document.createElement("td");
-        typeTd.className = "es-mapping-type";
+      const rows = keys.map((key) => {
         const p2 = props[key];
-        typeTd.textContent = p2.type ?? (p2.properties ? "object" : "(unknown)");
-        row.append(fieldTd, typeTd);
-        tbody.appendChild(row);
-      }
-      table2.appendChild(tbody);
-      mappingBody.appendChild(table2);
+        return [key, p2.type ?? (p2.properties ? "object" : "(unknown)")];
+      });
+      mappingBody.appendChild(createDetailTable([text3().es.fieldHeader, text3().es.typeHeader], rows, text3().es.noMappedFields));
     }
     function mkBtn(label, cls) {
       const b2 = document.createElement("button");
@@ -12649,11 +12842,10 @@ ${frontmatter.yaml}
       searchInput.placeholder = t2.es.queryPlaceholder;
       searchBtn.textContent = t2.common.search;
       docMoreBtn.textContent = t2.common.loadMore;
-      tabMapping.textContent = t2.es.mapping;
-      tabDoc.textContent = t2.es.doc;
+      detailTabs.setLabels({ mapping: t2.es.mapping, doc: t2.es.doc });
       if (!currentIndex) {
         setPaneEmpty(mappingBody, t2.es.selectIndex);
-      } else if (lastMapping && mappingBody.querySelector(".es-mapping-table")) {
+      } else if (lastMapping && mappingBody.querySelector(".db-detail-table")) {
         renderMapping(lastMapping);
       }
       if (!activeDocRow) {
@@ -21430,11 +21622,12 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
       dbSelect.value = target;
       currentDbInfo = files.find((f2) => f2.id === target) || null;
       syncConnectionActions();
+      const forceReload = options.forceReload ?? false;
       const explorerInitial = {
-        redis: pendingRedisInitial,
-        es: pendingEsInitial,
-        s3: pendingS3Initial,
-        dynamodb: pendingDynamodbInitial
+        redis: pendingRedisInitial ?? (forceReload && currentDbInfo?.kind === "redis" ? redisExplorer.getSelection() : undefined),
+        es: pendingEsInitial ?? (forceReload && currentDbInfo?.kind === "elasticsearch" ? esExplorer.getSelection() : undefined),
+        s3: pendingS3Initial ?? (forceReload && currentDbInfo?.kind === "s3" ? s3Explorer.getSelection() : undefined),
+        dynamodb: pendingDynamodbInitial ?? (forceReload && currentDbInfo?.kind === "dynamodb" ? dynamodbExplorer.getSelection() : undefined)
       };
       pendingRedisInitial = undefined;
       pendingEsInitial = undefined;
@@ -21567,7 +21760,7 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
         }
       } else if (currentDbInfo?.kind === "dynamodb") {
         const sel = dynamodbExplorer.getSelection();
-        if (sel.table !== undefined || sel.mode !== "scan" || sel.keyConditionExpression !== undefined || sel.filterExpression !== undefined || sel.expressionAttributeValues !== undefined || sel.itemKey !== undefined) {
+        if (sel.table !== undefined || sel.mode !== "scan" || sel.keyConditionExpression !== undefined || sel.filterExpression !== undefined || sel.expressionAttributeValues !== undefined || sel.itemKey !== undefined || sel.detailTab === "item") {
           state.dynamodb = sel;
         }
       }
@@ -22632,7 +22825,7 @@ ${entry.message}` : entry.detail ?? entry.message ?? "";
       if (!mounted || activeTabId !== id)
         return;
       const state = entry.pane.getState();
-      await entry.pane.enter(state.dbId ?? undefined, state.schema ?? undefined, state.table ?? undefined, state.view, { autoSelectFirst: state.dbId !== null });
+      await entry.pane.enter(state.dbId ?? undefined, state.schema ?? undefined, state.table ?? undefined, state.view, { autoSelectFirst: state.dbId !== null, forceReload: true });
       if (!mounted || activeTabId !== id)
         return;
       refreshChipLabel(id);
@@ -26128,7 +26321,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                     ],
                     [
                       "DynamoDB / LocalStack",
-                      "Detected when DynamoDB is enabled on a LocalStack compose service. List tables, inspect key schemas, scan or query items, follow pagination tokens, and open item details with a copyable key. Browsing is read-only."
+                      "Detected when DynamoDB is enabled on a LocalStack compose service. List tables, browse a Structure tab (key schema, GSI/LSI, and non-key attribute types inferred from loaded items), scan or query items, follow pagination tokens, and open item details with a copyable key. Browsing is read-only."
                     ],
                     [
                       "S3 / MinIO / LocalStack",
@@ -26795,7 +26988,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                     ],
                     [
                       "DynamoDB / LocalStack",
-                      "LocalStack の compose サービスで DynamoDB が有効な場合に検出。テーブル一覧、キースキーマ、scan / query、継続トークンによるページング、コピー可能なキー付きのアイテム詳細を表示します。閲覧専用です。"
+                      "LocalStack の compose サービスで DynamoDB が有効な場合に検出。テーブル一覧、構造タブ(キースキーマ・GSI/LSI・読み込み済みアイテムから推測した非キー属性の型)、scan / query、継続トークンによるページング、コピー可能なキー付きのアイテム詳細を表示します。閲覧専用です。"
                     ],
                     [
                       "S3 / MinIO / LocalStack",
@@ -36172,9 +36365,9 @@ code-viewer query agent-help`
           displaySource: "Applies to all projects in this browser.",
           excludedDirectories: "Excluded directories",
           omitDirs: "Skip these directory names while browsing and searching",
-          omitDirsHelp: "Reads no contents inside these directories. Applies to the sidebar (Files), Ctrl+K (file search), Ctrl+G (grep), Datastores, and the file change watcher.",
+          omitDirsHelp: "Reads no contents inside these directories. Applies to the sidebar (Files), Ctrl+K (file search), Ctrl+G (grep), Datastores, and the file change watcher. Supports gitignore-style wildcards (*, ?, [abc], [!abc]).",
           excludeNames: "Hide these file or directory names completely",
-          excludeNamesHelp: "Removes matching files or directories from the sidebar, search, and grep results entirely. Unlike Skip, the names themselves disappear from the UI.",
+          excludeNamesHelp: "Removes matching files or directories from the sidebar, search, and grep results entirely. Unlike Skip, the names themselves disappear from the UI. Supports gitignore-style wildcards (*, ?, [abc], [!abc]).",
           reset: "Restore defaults",
           autosaveNote: "Changes save automatically.",
           scopeSource: (project, source) => `Saved for project "${project}" in this browser. Source: ${source}. Used by the sidebar, Ctrl+K, Ctrl+G, Datastores, and the file change watcher. Restore defaults removes the browser override.`,
@@ -36462,9 +36655,9 @@ code-viewer query agent-help`
           displaySource: "このブラウザのすべてのプロジェクトに適用されます。",
           excludedDirectories: "除外ディレクトリ",
           omitDirs: "閲覧と検索でスキップするディレクトリ名",
-          omitDirsHelp: "これらのディレクトリの中身は読み込みません。サイドバー（Files）・Ctrl+K（ファイル検索）・Ctrl+G（grep）・Datastores・File change watcher の5機能すべてに適用されます。",
+          omitDirsHelp: "これらのディレクトリの中身は読み込みません。サイドバー（Files）・Ctrl+K（ファイル検索）・Ctrl+G（grep）・Datastores・File change watcher の5機能すべてに適用されます。gitignore方式のワイルドカード（*, ?, [abc], [!abc]）に対応しています。",
           excludeNames: "完全に非表示にするファイル名またはディレクトリ名",
-          excludeNamesHelp: "リスト中の名前に一致するファイル/ディレクトリを、サイドバー・検索結果・grep 結果から完全に消します。Skip と違い、名前自体が UI に出なくなります。",
+          excludeNamesHelp: "リスト中の名前に一致するファイル/ディレクトリを、サイドバー・検索結果・grep 結果から完全に消します。Skip と違い、名前自体が UI に出なくなります。gitignore方式のワイルドカード（*, ?, [abc], [!abc]）に対応しています。",
           reset: "デフォルトに戻す",
           autosaveNote: "変更は自動で保存されます。",
           scopeSource: (project, source) => `このブラウザのプロジェクト "${project}" に保存されます。ソース: ${source}。サイドバー、Ctrl+K、Ctrl+G、Datastores、File change watcher で使われます。「デフォルトに戻す」でブラウザ側の上書きを削除します。`,

package/web/style.css

@@ -11654,20 +11654,23 @@ body.db-resizing {
   cursor: default;
   color: var(--fg-muted);
 }
-.es-detail-pane {
+/* .db-detail-* は es-explorer (mapping/doc) と dynamodb-explorer
+   (structure/item) が共有する詳細ペイン/タブ切替/テーブルの共通スタイル。
+   detail-tabs.ts / detail-table.ts のクラス名と対応する。 */
+.db-detail-pane {
   flex: 1;
   display: flex;
   flex-direction: column;
   overflow: hidden;
   background: var(--bg);
 }
-.es-detail-tabs {
+.db-detail-tabs {
   display: flex;
   border-bottom: 1px solid var(--border);
   background: var(--bg-soft);
   flex-shrink: 0;
 }
-.es-detail-tab {
+.db-detail-tab {
   padding: 6px 14px;
   border: none;
   background: transparent;
@@ -11676,12 +11679,11 @@ body.db-resizing {
   color: var(--fg-muted);
   border-bottom: 2px solid transparent;
 }
-.es-detail-tab.active {
+.db-detail-tab.active {
   color: var(--fg);
   border-bottom-color: var(--accent);
 }
-.es-mapping-body,
-.es-doc-body {
+.db-detail-tab-body {
   flex: 1;
   overflow: auto;
   padding: 12px;
@@ -11753,26 +11755,27 @@ body.db-resizing {
   color: var(--fg-muted);
   margin-bottom: 8px;
 }
-.es-mapping-table {
+.db-detail-table {
   width: 100%;
   border-collapse: collapse;
   font-family: var(--mono, monospace);
   font-size: var(--db-font-mono);
+  margin-bottom: 16px;
 }
-.es-mapping-table th,
-.es-mapping-table td {
+.db-detail-table th,
+.db-detail-table td {
   text-align: left;
   padding: 4px 8px;
   border-bottom: 1px solid var(--border);
 }
-.es-mapping-table th {
+.db-detail-table th {
   font-weight: 600;
   background: var(--bg-soft);
 }
-.es-mapping-field {
+.db-detail-table-primary {
   font-weight: 500;
 }
-.es-mapping-type {
+.db-detail-table-muted {
   color: var(--fg-muted);
 }
 .es-doc-source {
@@ -11782,7 +11785,7 @@ body.db-resizing {
   word-break: break-all;
   margin: 0;
 }
-.es-value-empty {
+.db-value-empty {
   color: var(--fg-muted);
   font-size: var(--db-font-base);
   font-style: italic;
@@ -12472,13 +12475,6 @@ body.db-resizing {
   cursor: default;
   color: var(--fg-muted);
 }
-.dynamodb-detail-pane {
-  flex: 1;
-  overflow: auto;
-  padding: 12px;
-  color: var(--fg);
-  background: var(--bg);
-}
 .dynamodb-table-info-header,
 .dynamodb-item-detail-header {
   display: flex;
@@ -12491,8 +12487,7 @@ body.db-resizing {
   border-bottom: 1px solid var(--border);
   margin-bottom: 8px;
 }
-.dynamodb-table-info-meta,
-.dynamodb-table-info-keys {
+.dynamodb-table-info-meta {
   font-family: var(--mono, monospace);
   font-size: var(--db-font-sm);
   color: var(--fg-muted);
@@ -12504,8 +12499,35 @@ body.db-resizing {
   font-size: var(--db-font-sm);
   font-weight: 400;
 }
-.dynamodb-table-info-empty {
-  margin-top: 24px;
+.dynamodb-index-section {
+  margin-bottom: 16px;
+}
+.dynamodb-index-heading {
+  font-weight: 600;
+  font-size: var(--db-font-sm);
+  color: var(--fg-muted);
+  margin-bottom: 4px;
+}
+.dynamodb-index-row {
+  padding: 4px 0;
+  border-bottom: 1px solid var(--border);
+}
+.dynamodb-index-name {
+  font-family: var(--mono, monospace);
+  font-size: var(--db-font-mono);
+  font-weight: 500;
+}
+.dynamodb-index-detail {
+  font-family: var(--mono, monospace);
+  font-size: var(--db-font-sm);
+  color: var(--fg-muted);
+}
+.dynamodb-attr-note {
+  margin-top: -4px;
+  margin-bottom: 16px;
+  font-size: var(--db-font-sm);
+  color: var(--fg-muted);
+  font-style: italic;
 }
 .dynamodb-item-source {
   font-family: var(--mono, monospace);