@youtyan/code-viewer 0.2.4 → 0.2.5

package/web/app.js

@@ -6700,7 +6700,7 @@
     }
     return resolved.join("/");
   }
-  function createMarkdownIt(target, highlighter, signal) {
+  function createMarkdownIt(target, highlighter, signal, resolveAssetUrl) {
     const md = new lib_default({
       html: false,
       linkify: true,
@@ -6765,8 +6765,11 @@
       const token = tokens[idx];
       const src = token.attrGet("src") || "";
       const resolved = resolveMarkdownAssetPath(target.path, src);
-      if (resolved)
-        token.attrSet("src", buildRawFileUrl({ path: resolved, ref: target.ref || "worktree" }));
+      if (resolved) {
+        const assetUrl = resolveAssetUrl ? resolveAssetUrl(resolved, src) : buildRawFileUrl({ path: resolved, ref: target.ref || "worktree" });
+        if (assetUrl)
+          token.attrSet("src", assetUrl);
+      }
       token.attrSet("loading", "lazy");
       return image2(tokens, idx, options, env, self);
     };
@@ -6796,7 +6799,7 @@
     markdown.className = "gdp-markdown-preview markdown-body";
     if (options.signal?.aborted)
       return markdown;
-    markdown.innerHTML = renderMarkdownHtml(textValue, target, highlighter, options.signal);
+    markdown.innerHTML = renderMarkdownHtml(textValue, target, highlighter, options.signal, options.resolveAssetUrl);
     if (options.signal?.aborted)
       return markdown;
     enhanceTaskLists(markdown);
@@ -6812,8 +6815,8 @@
     wireMarkdownInteractions(markdown, target, options);
     return markdown;
   }
-  function renderMarkdownHtml(textValue, target, highlighter, signal) {
-    const md = createMarkdownIt(target, highlighter, signal);
+  function renderMarkdownHtml(textValue, target, highlighter, signal, resolveAssetUrl) {
+    const md = createMarkdownIt(target, highlighter, signal, resolveAssetUrl);
     const frontmatter = splitYamlFrontmatter(textValue);
     if (!frontmatter)
       return md.render(textValue);
@@ -7304,7 +7307,7 @@ ${frontmatter.yaml}
     }
     function annotationLocationLabel(entry) {
       if (entry.target?.kind === "database") {
-        const parts = ["Database"];
+        const parts = ["Datastores"];
         if (entry.target.db)
           parts.push(entry.target.db);
         if (entry.target.schema)
@@ -7412,7 +7415,7 @@ ${frontmatter.yaml}
         return;
       const strip = document.createElement("section");
       strip.className = "gdp-db-annotation-strip";
-      strip.setAttribute("aria-label", "Database annotations");
+      strip.setAttribute("aria-label", "Datastore annotations");
       for (const entry of matches) {
         strip.appendChild(buildDatabaseAnnotationBlock(entry));
       }
@@ -7655,7 +7658,7 @@ ${frontmatter.yaml}
       return firstLine.length > 90 ? `${firstLine.slice(0, 90)}…` : firstLine;
     }
     function databaseAnnotationTitle(target) {
-      const parts = [target.table || target.schema || target.db || "Database"];
+      const parts = [target.table || target.schema || target.db || "Datastores"];
       if (target.schema && target.table)
         parts.unshift(target.schema);
       if (target.tab === "data" && target.data?.search)
@@ -7669,7 +7672,7 @@ ${frontmatter.yaml}
       return parts.join(" / ");
     }
     function openDatabaseCaptureForm(target) {
-      $("#annotation-detail-session").textContent = activeSessionId || "Database annotations";
+      $("#annotation-detail-session").textContent = activeSessionId || "Datastore annotations";
       $("#annotation-detail-step").textContent = "new";
       const location2 = $("#annotation-detail-location");
       location2.textContent = databaseAnnotationTitle(target);
@@ -7710,7 +7713,7 @@ ${frontmatter.yaml}
             body: JSON.stringify({
               action: "add",
               session_id: activeSessionId || undefined,
-              session_title: activeSessionId ? undefined : "Database annotations",
+              session_title: activeSessionId ? undefined : "Datastore annotations",
               target,
               title: titleInput.value,
               body: bodyInput.value
@@ -8148,6 +8151,35 @@ ${frontmatter.yaml}
     return `${prefix}-${Date.now().toString(36)}${Math.random().toString(36).slice(2, 10)}`;
   }
 
+  // web-src/views/database/abort-guard.ts
+  function createAbortGuard() {
+    let active = null;
+    let runId = 0;
+    return {
+      start() {
+        active?.abort();
+        const abort = new AbortController;
+        active = abort;
+        const requestRunId = ++runId;
+        return {
+          signal: abort.signal,
+          isStale() {
+            return abort.signal.aborted || requestRunId !== runId;
+          },
+          finish() {
+            if (active === abort)
+              active = null;
+          }
+        };
+      },
+      dispose() {
+        runId++;
+        active?.abort();
+        active = null;
+      }
+    };
+  }
+
   // web-src/views/media-embed.ts
   var MEDIA_RE = /\.(png|jpe?g|gif|webp|svg|avif|bmp|ico|mp4|webm|mov|mp3|wav|ogg|flac|m4a|aac|opus)(\?.*)?$/i;
   var IMAGE_RE = /\.(png|jpe?g|gif|webp|svg|avif|bmp|ico)(\?.*)?$/i;
@@ -8591,35 +8623,6 @@ ${frontmatter.yaml}
     return fallback.charAt(0).toUpperCase() + fallback.slice(1);
   }
 
-  // web-src/views/database/abort-guard.ts
-  function createAbortGuard() {
-    let active = null;
-    let runId = 0;
-    return {
-      start() {
-        active?.abort("abort-guard:start");
-        const abort = new AbortController;
-        active = abort;
-        const requestRunId = ++runId;
-        return {
-          signal: abort.signal,
-          isStale() {
-            return abort.signal.aborted || requestRunId !== runId;
-          },
-          finish() {
-            if (active === abort)
-              active = null;
-          }
-        };
-      },
-      dispose() {
-        runId++;
-        active?.abort("abort-guard:dispose");
-        active = null;
-      }
-    };
-  }
-
   // web-src/views/database/pane-status.ts
   function setPaneStatus(el, message, options = {}) {
     el.innerHTML = "";
@@ -8703,6 +8706,10 @@ ${frontmatter.yaml}
     let suppressNotify = false;
     let queryNotifyTimer = null;
     let disposed = false;
+    let activeIndexRow = null;
+    let activeDocRow = null;
+    const indexRowsByName = new Map;
+    const docRowsById = new Map;
     const indexGuard = createAbortGuard();
     const mappingGuard = createAbortGuard();
     const docsGuard = createAbortGuard();
@@ -8728,14 +8735,17 @@ ${frontmatter.yaml}
     }
     function renderIndices(indices) {
       indexList.innerHTML = "";
+      indexRowsByName.clear();
       if (indices.length === 0) {
         setIndexStatus("(no indices)");
         return;
       }
+      const fragment = document.createDocumentFragment();
       for (const ix of indices) {
         const item = document.createElement("div");
         item.className = "es-index-item";
         item.dataset.indexName = ix.name;
+        indexRowsByName.set(ix.name, item);
         const name = document.createElement("span");
         name.className = "es-index-name";
         name.textContent = ix.name;
@@ -8744,20 +8754,24 @@ ${frontmatter.yaml}
         meta.className = "es-index-meta";
         meta.textContent = `${ix.docCount.toLocaleString()} docs / ${formatBytes(ix.sizeBytes)}`;
         item.append(name, meta);
-        item.addEventListener("click", () => selectIndex(ix.name));
-        indexList.appendChild(item);
+        fragment.appendChild(item);
       }
+      indexList.appendChild(fragment);
     }
     function highlightActiveIndex(name) {
-      for (const item of indexList.querySelectorAll(".es-index-item")) {
-        item.classList.toggle("active", item.dataset.indexName === name);
-      }
+      if (activeIndexRow?.dataset.indexName === name)
+        return;
+      activeIndexRow?.classList.remove("active");
+      activeIndexRow = indexRowsByName.get(name) ?? null;
+      activeIndexRow?.classList.add("active");
     }
     function appendDocs(hits) {
+      const fragment = document.createDocumentFragment();
       for (const hit of hits) {
         const row = document.createElement("div");
         row.className = "es-doc-item";
         row.dataset.docId = hit._id;
+        docRowsById.set(hit._id, row);
         const id = document.createElement("span");
         id.className = "es-doc-id";
         id.textContent = hit._id;
@@ -8766,24 +8780,38 @@ ${frontmatter.yaml}
         preview.className = "es-doc-preview";
         preview.textContent = previewSource(hit._source);
         row.append(id, preview);
-        row.addEventListener("click", () => selectDoc(hit._id));
-        docList.appendChild(row);
+        fragment.appendChild(row);
       }
+      docList.appendChild(fragment);
     }
     function previewSource(src) {
       if (src === null || src === undefined)
         return "";
-      try {
-        const s2 = JSON.stringify(src);
-        return s2.length > 200 ? `${s2.slice(0, 200)}…` : s2;
-      } catch {
-        return String(src);
+      if (Array.isArray(src))
+        return `array(${src.length})`;
+      if (typeof src === "object") {
+        const entries = Object.entries(src).slice(0, 6);
+        const parts = entries.map(([key, value]) => {
+          if (value === null)
+            return `${key}=null`;
+          if (Array.isArray(value))
+            return `${key}=array(${value.length})`;
+          if (typeof value === "object")
+            return `${key}=object`;
+          const text3 = String(value);
+          return `${key}=${text3.length > 40 ? `${text3.slice(0, 40)}...` : text3}`;
+        });
+        return parts.join(" / ");
       }
+      const text2 = String(src);
+      return text2.length > 200 ? `${text2.slice(0, 200)}...` : text2;
     }
     function highlightActiveDoc(id) {
-      for (const row of docList.querySelectorAll(".es-doc-item")) {
-        row.classList.toggle("active", row.dataset.docId === id);
-      }
+      if (activeDocRow?.dataset.docId === id)
+        return;
+      activeDocRow?.classList.remove("active");
+      activeDocRow = docRowsById.get(id) ?? null;
+      activeDocRow?.classList.add("active");
     }
     function setDetailTab(tab) {
       detailTab = tab;
@@ -8913,6 +8941,8 @@ ${frontmatter.yaml}
       if (!append) {
         lastSort = undefined;
         setDocStatus("Loading docs...");
+        docRowsById.clear();
+        activeDocRow = null;
       }
       try {
         const params = new URLSearchParams({
@@ -8938,8 +8968,10 @@ ${frontmatter.yaml}
         if (disposed || slot.isStale() || requestRunId !== loadRunId || requestDbId !== currentDbId || requestIndex !== currentIndex || data.index !== requestIndex || requestQuery !== currentQuery) {
           return;
         }
-        if (!append)
+        if (!append) {
           docList.innerHTML = "";
+          docRowsById.clear();
+        }
         if (data.hits.length === 0 && !append) {
           setDocStatus("(no docs)");
         } else {
@@ -9039,6 +9071,22 @@ ${frontmatter.yaml}
       }, 300);
     });
     docMoreBtn.addEventListener("click", () => loadDocs(true));
+    indexList.addEventListener("click", (e2) => {
+      const row = e2.target?.closest(".es-index-item");
+      if (!row || !indexList.contains(row))
+        return;
+      const name = row.dataset.indexName;
+      if (name)
+        selectIndex(name);
+    });
+    docList.addEventListener("click", (e2) => {
+      const row = e2.target?.closest(".es-doc-item");
+      if (!row || !docList.contains(row))
+        return;
+      const id = row.dataset.docId;
+      if (id)
+        selectDoc(id);
+    });
     async function load(dbId, initial) {
       if (disposed)
         return;
@@ -9061,6 +9109,9 @@ ${frontmatter.yaml}
       searchInput.value = initial?.query ?? "";
       currentQuery = searchInput.value.trim();
       docList.innerHTML = "";
+      docRowsById.clear();
+      activeIndexRow = null;
+      activeDocRow = null;
       docMoreBtn.hidden = true;
       mappingBody.innerHTML = "";
       mappingBody.textContent = "Select an index to view its mapping.";
@@ -9117,6 +9168,10 @@ ${frontmatter.yaml}
       searchInput.value = "";
       indexList.innerHTML = "";
       docList.innerHTML = "";
+      indexRowsByName.clear();
+      docRowsById.clear();
+      activeIndexRow = null;
+      activeDocRow = null;
       docMoreBtn.hidden = true;
       mappingBody.innerHTML = "";
       mappingBody.textContent = "Select an index to view its mapping.";
@@ -9964,6 +10019,22 @@ ${frontmatter.yaml}
     let entries = [];
     const expandedIds = new Set;
     let clearConfirmTimer = null;
+    let lastRefreshKey = null;
+    let lastRefreshAt = 0;
+    let inFlightRefresh = null;
+    const entryRowsById = new Map;
+    let selectedEntryRow = null;
+    function currentRefreshParams() {
+      const dbId = callbacks.getDbId();
+      const schema = callbacks.getSchema();
+      const searchParams = new URLSearchParams;
+      if (dbId)
+        searchParams.set("db", dbId);
+      if (schema)
+        searchParams.set("schema", schema);
+      const params = searchParams.toString() ? `?${searchParams.toString()}` : "";
+      return { key: params, params };
+    }
     function armButtonConfirm(button, confirmText, defaultText) {
       if (button.dataset.confirm === "1") {
         button.dataset.confirm = "";
@@ -9980,29 +10051,42 @@ ${frontmatter.yaml}
       }, 3000);
       return false;
     }
-    async function refresh() {
-      const dbId = callbacks.getDbId();
-      const schema = callbacks.getSchema();
-      const searchParams = new URLSearchParams;
-      if (dbId)
-        searchParams.set("db", dbId);
-      if (schema)
-        searchParams.set("schema", schema);
-      const params = searchParams.toString() ? `?${searchParams.toString()}` : "";
-      try {
+    async function refresh(options = {}) {
+      const { key: refreshKey, params } = currentRefreshParams();
+      const now = Date.now();
+      if (inFlightRefresh?.key === refreshKey) {
+        return inFlightRefresh.promise;
+      }
+      if (!options.force && refreshKey === lastRefreshKey && now - lastRefreshAt < 1000) {
+        return;
+      }
+      const promise = (async () => {
         const res = await fetch(`/_db/history${params}`);
         if (!res.ok)
           return;
         const state = await res.json();
+        if (currentRefreshParams().key !== refreshKey)
+          return;
         entries = state.entries;
+        lastRefreshKey = refreshKey;
+        lastRefreshAt = Date.now();
         if (selectedEntryId && !entries.some((entry) => entry.id === selectedEntryId)) {
           clearDetail();
         }
         render();
-      } catch {}
+      })().catch(() => {});
+      inFlightRefresh = { key: refreshKey, promise };
+      try {
+        await promise;
+      } finally {
+        if (inFlightRefresh?.promise === promise)
+          inFlightRefresh = null;
+      }
     }
     function render() {
       listEl.innerHTML = "";
+      entryRowsById.clear();
+      selectedEntryRow = null;
       if (entries.length === 0) {
         const empty = document.createElement("div");
         empty.className = "db-query-history-empty";
@@ -10010,21 +10094,25 @@ ${frontmatter.yaml}
         listEl.appendChild(empty);
         return;
       }
+      const fragment = document.createDocumentFragment();
       for (const entry of entries) {
-        listEl.appendChild(renderEntry(entry));
+        fragment.appendChild(renderEntry(entry));
       }
+      listEl.appendChild(fragment);
     }
     let selectedEntryId = null;
     function clearDetail() {
       selectedEntryId = null;
+      selectedEntryRow?.classList.remove("selected");
+      selectedEntryRow = null;
       detailCol.innerHTML = "";
       detailCol.appendChild(detailPlaceholder);
     }
     function selectEntry(entry) {
       selectedEntryId = entry.id;
-      listEl.querySelectorAll(".db-query-history-entry").forEach((el2) => {
-        el2.classList.toggle("selected", el2.dataset.id === entry.id);
-      });
+      selectedEntryRow?.classList.remove("selected");
+      selectedEntryRow = entryRowsById.get(entry.id) ?? null;
+      selectedEntryRow?.classList.add("selected");
       renderDetail(entry);
     }
     function renderDetail(entry) {
@@ -10081,9 +10169,12 @@ ${frontmatter.yaml}
     function renderEntry(entry) {
       const item = document.createElement("div");
       item.className = "db-query-history-entry";
-      if (entry.id === selectedEntryId)
+      if (entry.id === selectedEntryId) {
         item.classList.add("selected");
+        selectedEntryRow = item;
+      }
       item.dataset.id = entry.id;
+      entryRowsById.set(entry.id, item);
       const meta = document.createElement("div");
       meta.className = "db-query-history-entry-meta";
       const byIcon = document.createElement("span");
@@ -10170,8 +10261,9 @@ ${frontmatter.yaml}
         expandedIds.delete(id);
         if (selectedEntryId === id)
           resetDetailCol();
-        const itemEl = listEl.querySelector(`.db-query-history-entry[data-id="${CSS.escape(id)}"]`);
+        const itemEl = entryRowsById.get(id);
         if (itemEl) {
+          entryRowsById.delete(id);
           itemEl.remove();
           if (entries.length === 0)
             render();
@@ -10215,11 +10307,13 @@ ${frontmatter.yaml}
       } catch {}
     });
     refreshBtn.addEventListener("click", () => {
-      refresh();
+      refresh({ force: true });
     });
     function clear() {
       entries = [];
       expandedIds.clear();
+      lastRefreshKey = null;
+      lastRefreshAt = 0;
       if (clearConfirmTimer) {
         clearTimeout(clearConfirmTimer);
         clearConfirmTimer = null;
@@ -10321,6 +10415,10 @@ ${frontmatter.yaml}
     let keyRunId = 0;
     let suppressNotify = false;
     let disposed = false;
+    let activeDbRow = null;
+    let activeKeyRow = null;
+    const dbRowsByIndex = new Map;
+    const keyRowsByName = new Map;
     const dbGuard = createAbortGuard();
     const keysGuard = createAbortGuard();
     const valueGuard = createAbortGuard();
@@ -10346,10 +10444,13 @@ ${frontmatter.yaml}
     }
     function renderDatabases(databases) {
       dbList.innerHTML = "";
+      dbRowsByIndex.clear();
+      const fragment = document.createDocumentFragment();
       for (const db of databases) {
         const item = document.createElement("div");
         item.className = "redis-db-item";
         item.dataset.dbIndex = String(db.index);
+        dbRowsByIndex.set(db.index, item);
         const name = document.createElement("span");
         name.className = "redis-db-name";
         name.textContent = `db${db.index}`;
@@ -10357,20 +10458,24 @@ ${frontmatter.yaml}
         count.className = "redis-db-count";
         count.textContent = `${db.keyCount.toLocaleString()} keys`;
         item.append(name, count);
-        item.addEventListener("click", () => selectDatabase(db.index));
-        dbList.appendChild(item);
+        fragment.appendChild(item);
       }
+      dbList.appendChild(fragment);
     }
     function highlightActiveDb(index) {
-      for (const item of dbList.querySelectorAll(".redis-db-item")) {
-        item.classList.toggle("active", item.dataset.dbIndex === String(index));
-      }
+      if (activeDbRow?.dataset.dbIndex === String(index))
+        return;
+      activeDbRow?.classList.remove("active");
+      activeDbRow = dbRowsByIndex.get(index) ?? null;
+      activeDbRow?.classList.add("active");
     }
     function appendKeys(keys) {
+      const fragment = document.createDocumentFragment();
       for (const k of keys) {
         const row = document.createElement("div");
         row.className = "redis-key-item";
         row.dataset.keyName = k.name;
+        keyRowsByName.set(k.name, row);
         const typeBadge = document.createElement("span");
         typeBadge.className = `redis-type-badge redis-type-${k.type}`;
         typeBadge.textContent = k.type;
@@ -10379,18 +10484,20 @@ ${frontmatter.yaml}
         nameEl.textContent = k.name;
         nameEl.title = k.name;
         row.append(typeBadge, nameEl);
-        row.addEventListener("click", () => selectKey(k.name));
-        keyList.appendChild(row);
+        fragment.appendChild(row);
       }
+      keyList.appendChild(fragment);
     }
     function highlightActiveKey(name) {
-      for (const row of keyList.querySelectorAll(".redis-key-item")) {
-        row.classList.toggle("active", row.dataset.keyName === name);
-      }
+      if (activeKeyRow?.dataset.keyName === name)
+        return;
+      activeKeyRow?.classList.remove("active");
+      activeKeyRow = keyRowsByName.get(name) ?? null;
+      activeKeyRow?.classList.add("active");
     }
     function makeNotice(message, kind = "info") {
       const div = document.createElement("div");
-      div.className = kind === "warn" ? "redis-value-truncation" : "redis-value-info";
+      div.className = kind === "warn" ? "datastore-value-truncation" : "datastore-value-info";
       div.textContent = message;
       return div;
     }
@@ -10548,6 +10655,8 @@ ${frontmatter.yaml}
       notifySelectionChange();
       highlightActiveDb(dbIndex);
       keyList.innerHTML = "";
+      keyRowsByName.clear();
+      activeKeyRow = null;
       mainPane.textContent = "Select a key to view its value.";
       await loadKeys(false);
     }
@@ -10583,8 +10692,11 @@ ${frontmatter.yaml}
         if (disposed || slot.isStale() || requestRunId !== loadRunId || requestDbId !== currentDbId || requestDbIndex !== currentDbIndex || data.dbIndex !== requestDbIndex) {
           return;
         }
-        if (!append)
+        if (!append) {
           keyList.innerHTML = "";
+          keyRowsByName.clear();
+          activeKeyRow = null;
+        }
         if (data.keys.length === 0 && !append) {
           setKeyStatus("(no keys)");
         } else {
@@ -10605,6 +10717,23 @@ ${frontmatter.yaml}
       }
     }
     keyMoreBtn.addEventListener("click", () => loadKeys(true));
+    dbList.addEventListener("click", (e2) => {
+      const row = e2.target?.closest(".redis-db-item");
+      if (!row || !dbList.contains(row))
+        return;
+      const raw = row.dataset.dbIndex;
+      const index = raw === undefined ? NaN : Number(raw);
+      if (Number.isInteger(index))
+        selectDatabase(index);
+    });
+    keyList.addEventListener("click", (e2) => {
+      const row = e2.target?.closest(".redis-key-item");
+      if (!row || !keyList.contains(row))
+        return;
+      const key = row.dataset.keyName;
+      if (key)
+        selectKey(key);
+    });
     keyFilterForm.addEventListener("submit", (e2) => {
       e2.preventDefault();
       const nextFilter = keyFilterInput.value.trim() || "*";
@@ -10634,6 +10763,9 @@ ${frontmatter.yaml}
       keyFilterInput.value = currentKeyFilter === "*" ? "" : currentKeyFilter;
       currentCursor = "0";
       keyList.innerHTML = "";
+      keyRowsByName.clear();
+      activeDbRow = null;
+      activeKeyRow = null;
       keyMoreBtn.hidden = true;
       mainPane.textContent = "Select a key to view its value.";
       setDbStatus("Loading databases...");
@@ -10653,11 +10785,21 @@ ${frontmatter.yaml}
         if (initial?.dbIndex !== undefined && data.databases.some((d2) => d2.index === initial.dbIndex)) {
           suppressNotify = true;
           try {
-            await selectDatabase(initial.dbIndex);
+            currentDbIndex = initial.dbIndex;
+            currentKey = null;
+            currentCursor = "0";
+            highlightActiveDb(initial.dbIndex);
+            keyList.innerHTML = "";
+            keyRowsByName.clear();
+            mainPane.textContent = "Select a key to view its value.";
+            const valuePromise = initial.key ? selectKey(initial.key).catch(() => {}) : null;
+            await loadKeys(false);
             if (currentDbId !== dbId)
               return;
-            if (initial.key) {
-              await selectKey(initial.key);
+            if (valuePromise) {
+              await valuePromise;
+              if (initial.key)
+                highlightActiveKey(initial.key);
             }
           } finally {
             suppressNotify = false;
@@ -10687,6 +10829,10 @@ ${frontmatter.yaml}
       currentCursor = "0";
       dbList.innerHTML = "";
       keyList.innerHTML = "";
+      dbRowsByIndex.clear();
+      keyRowsByName.clear();
+      activeDbRow = null;
+      activeKeyRow = null;
       keyMoreBtn.hidden = true;
       mainPane.textContent = "Select a database to view keys.";
     }
@@ -10704,6 +10850,654 @@ ${frontmatter.yaml}
     return { el: container, load, clear, dispose, getSelection };
   }
 
+  // web-src/core/database/s3-keys.ts
+  function s3ObjectName(key) {
+    const trimmed = key.replace(/\/+$/, "");
+    const idx = trimmed.lastIndexOf("/");
+    return idx >= 0 ? trimmed.slice(idx + 1) : trimmed;
+  }
+
+  // web-src/views/source-preview-elements.ts
+  function renderHtmlPreviewFrame(title, html, extraClass = "") {
+    const preview = document.createElement("div");
+    preview.className = ["gdp-html-preview", extraClass].filter(Boolean).join(" ");
+    const frame = document.createElement("iframe");
+    frame.title = title;
+    frame.sandbox.value = "";
+    frame.referrerPolicy = "no-referrer";
+    frame.srcdoc = html;
+    preview.appendChild(frame);
+    return preview;
+  }
+  function appendMediaEmbed(view, opts) {
+    if (opts.kind === "video") {
+      const video = document.createElement("video");
+      video.src = opts.url;
+      video.controls = true;
+      video.preload = "metadata";
+      view.appendChild(video);
+    } else if (opts.kind === "audio") {
+      const audio = document.createElement("audio");
+      audio.src = opts.url;
+      audio.controls = true;
+      audio.preload = "metadata";
+      view.appendChild(audio);
+    } else if (opts.kind === "pdf") {
+      const frame = document.createElement("iframe");
+      frame.src = opts.url;
+      frame.title = opts.title;
+      frame.loading = "lazy";
+      view.appendChild(frame);
+    } else {
+      const img = document.createElement("img");
+      img.src = opts.url;
+      img.alt = "";
+      if (opts.onImageLoad) {
+        img.addEventListener("load", () => opts.onImageLoad?.(img), {
+          once: true
+        });
+      }
+      view.appendChild(img);
+    }
+  }
+  function renderUnsupportedPreview(opts) {
+    const view = document.createElement("div");
+    view.className = ["gdp-source-viewer unsupported", opts.className || ""].filter(Boolean).join(" ");
+    const content = document.createElement("div");
+    content.className = "gdp-source-unsupported-content";
+    const title = document.createElement("strong");
+    title.className = "gdp-source-unsupported-title";
+    title.textContent = "Preview unavailable";
+    const message = document.createElement("div");
+    message.className = "gdp-source-unsupported-message";
+    message.textContent = opts.message;
+    content.append(title, message, ...opts.extraChildren || []);
+    view.appendChild(content);
+    return view;
+  }
+
+  // web-src/views/database/s3-explorer.ts
+  function buildS3RawUrl(dbId, bucket, key) {
+    const params = new URLSearchParams({ db: dbId, bucket, key });
+    return `/_db/s3/raw?${params}`;
+  }
+  function s3Uri(bucket, key) {
+    return `s3://${bucket}/${key}`;
+  }
+  function objectTypeLabel(key, contentType) {
+    const kind = sourceDisplayKind(key);
+    return humanFileKind(key, contentType, kind === "unsupported" ? "unsupported file" : kind);
+  }
+  function createS3Explorer(callbacks = {}) {
+    const container = document.createElement("div");
+    container.className = "s3-explorer";
+    const objectPane = document.createElement("div");
+    objectPane.className = "s3-object-list-pane";
+    const toolbar = document.createElement("div");
+    toolbar.className = "s3-toolbar";
+    const bucketRow = document.createElement("div");
+    bucketRow.className = "s3-bucket-row";
+    const bucketLabel = document.createElement("label");
+    bucketLabel.className = "s3-field-label";
+    bucketLabel.textContent = "Bucket";
+    const bucketSelect = document.createElement("select");
+    bucketSelect.className = "s3-bucket-select";
+    bucketLabel.appendChild(bucketSelect);
+    bucketRow.appendChild(bucketLabel);
+    const searchRow = document.createElement("form");
+    searchRow.className = "s3-search-row";
+    const searchInput = document.createElement("input");
+    searchInput.type = "search";
+    searchInput.className = "s3-search-input";
+    searchInput.placeholder = "Search objects";
+    searchInput.autocomplete = "off";
+    const searchBtn = document.createElement("button");
+    searchBtn.type = "submit";
+    searchBtn.className = "db-btn db-btn-primary s3-search-btn";
+    searchBtn.textContent = "Search";
+    searchRow.append(searchInput, searchBtn);
+    const optionRow = document.createElement("div");
+    optionRow.className = "s3-options-row";
+    const modeSeg = document.createElement("div");
+    modeSeg.className = "seg s3-mode-seg";
+    const prefixModeBtn = document.createElement("button");
+    prefixModeBtn.type = "button";
+    prefixModeBtn.textContent = "Prefix";
+    const containsModeBtn = document.createElement("button");
+    containsModeBtn.type = "button";
+    containsModeBtn.textContent = "Contains";
+    modeSeg.append(prefixModeBtn, containsModeBtn);
+    const sortSelect = document.createElement("select");
+    sortSelect.className = "s3-sort-select";
+    const sortUpdated = document.createElement("option");
+    sortUpdated.value = "updated-desc";
+    sortUpdated.textContent = "Updated newest";
+    const sortKey = document.createElement("option");
+    sortKey.value = "key-asc";
+    sortKey.textContent = "Key A-Z";
+    sortSelect.append(sortUpdated, sortKey);
+    optionRow.append(modeSeg, sortSelect);
+    toolbar.append(bucketRow, searchRow, optionRow);
+    objectPane.appendChild(toolbar);
+    const objectStatus = document.createElement("div");
+    objectStatus.className = "s3-object-status";
+    objectPane.appendChild(objectStatus);
+    const objectList = document.createElement("div");
+    objectList.className = "s3-object-list";
+    objectPane.appendChild(objectList);
+    const moreBtn = document.createElement("button");
+    moreBtn.type = "button";
+    moreBtn.className = "s3-object-more-btn";
+    moreBtn.textContent = "Load more";
+    moreBtn.hidden = true;
+    objectPane.appendChild(moreBtn);
+    const previewPane = document.createElement("div");
+    previewPane.className = "s3-preview-pane";
+    previewPane.textContent = "Select an object to preview.";
+    container.append(objectPane, previewPane);
+    let currentDbId = null;
+    let currentBucket = null;
+    let currentKey = null;
+    let currentMode = "prefix";
+    let currentSort = "updated-desc";
+    let currentSearch = "";
+    let currentNextToken;
+    const objectsByKey = new Map;
+    const objectRowsByKey = new Map;
+    let disposed = false;
+    let loadRunId = 0;
+    let objectRunId = 0;
+    let suppressNotify = false;
+    let activeObjectRow = null;
+    const bucketGuard = createAbortGuard();
+    const objectGuard = createAbortGuard();
+    const previewGuard = createAbortGuard();
+    function notifySelectionChange() {
+      if (suppressNotify)
+        return;
+      callbacks.onSelectionChange?.(getSelection());
+    }
+    function setMode(mode) {
+      currentMode = mode;
+      prefixModeBtn.classList.toggle("active", mode === "prefix");
+      containsModeBtn.classList.toggle("active", mode === "contains");
+      searchInput.placeholder = mode === "prefix" ? "Prefix, e.g. photos/2026/" : "Filename contains";
+    }
+    function renderBuckets(buckets) {
+      bucketSelect.innerHTML = "";
+      for (const bucket of buckets) {
+        const opt = document.createElement("option");
+        opt.value = bucket.name;
+        opt.textContent = bucket.name;
+        bucketSelect.appendChild(opt);
+      }
+      bucketSelect.disabled = buckets.length === 0;
+    }
+    function setObjectStatusFromResponse(resp) {
+      objectStatus.textContent = "";
+      const parts = [
+        `${resp.objects.length.toLocaleString()} shown`,
+        `${resp.scannedObjects.toLocaleString()} scanned`,
+        resp.sort === "updated-desc" ? "newest first in scanned objects" : "sorted by key"
+      ];
+      if (resp.scanLimitReached) {
+        parts.push("scan cap reached; narrow the prefix to search more precisely");
+      }
+      objectStatus.textContent = parts.join(" / ");
+      objectStatus.classList.toggle("warn", !!resp.scanLimitReached);
+    }
+    function highlightActiveObject(key) {
+      if (activeObjectRow?.dataset.key === key)
+        return;
+      activeObjectRow?.classList.remove("active");
+      activeObjectRow = key ? objectRowsByKey.get(key) ?? null : null;
+      activeObjectRow?.classList.add("active");
+    }
+    async function fetchObjectHeadForSelection(key, signal) {
+      if (!currentDbId || !currentBucket)
+        return { key, sizeBytes: 0 };
+      const params = new URLSearchParams({
+        db: currentDbId,
+        bucket: currentBucket,
+        key
+      });
+      const res = await fetch(`/_db/s3/head?${params}`, { signal });
+      if (!res.ok)
+        return { key, sizeBytes: 0 };
+      const data = await res.json();
+      return {
+        key,
+        sizeBytes: data.sizeBytes ?? 0,
+        ...data.updatedAt ? { updatedAt: data.updatedAt } : {},
+        ...data.contentType ? { contentType: data.contentType } : {},
+        ...data.etag ? { etag: data.etag } : {}
+      };
+    }
+    function appendObjects(objects) {
+      const fragment = document.createDocumentFragment();
+      for (const object of objects) {
+        objectsByKey.set(object.key, object);
+        const row = document.createElement("div");
+        row.className = "s3-object-item";
+        row.dataset.key = object.key;
+        objectRowsByKey.set(object.key, row);
+        const name = document.createElement("span");
+        name.className = "s3-object-name";
+        name.textContent = object.key;
+        name.title = object.key;
+        const meta = document.createElement("span");
+        meta.className = "s3-object-meta";
+        const kind = objectTypeLabel(object.key, object.contentType);
+        const size = formatBytes(object.sizeBytes);
+        const updated = formatFileDate(object.updatedAt);
+        meta.textContent = [kind, size, updated].filter(Boolean).join(" / ");
+        row.append(name, meta);
+        fragment.appendChild(row);
+      }
+      objectList.appendChild(fragment);
+    }
+    async function loadObjects(append) {
+      if (!currentDbId || !currentBucket || disposed)
+        return;
+      const slot = objectGuard.start();
+      const requestRunId = loadRunId;
+      const requestDbId = currentDbId;
+      const requestBucket = currentBucket;
+      const requestSearch = currentSearch;
+      const requestMode = currentMode;
+      const requestSort = currentSort;
+      moreBtn.disabled = true;
+      if (!append) {
+        objectList.innerHTML = "";
+        objectsByKey.clear();
+        objectRowsByKey.clear();
+        activeObjectRow = null;
+        currentKey = null;
+        currentNextToken = undefined;
+        setPaneStatus(objectList, "Loading objects...");
+        previewPane.textContent = "Select an object to preview.";
+      }
+      try {
+        const params = new URLSearchParams({
+          db: requestDbId,
+          bucket: requestBucket,
+          mode: requestMode,
+          sort: requestSort,
+          limit: requestSort === "updated-desc" ? "1000" : "200"
+        });
+        if (requestMode === "prefix") {
+          if (requestSearch)
+            params.set("q", requestSearch);
+        } else if (requestSearch) {
+          params.set("q", requestSearch);
+        }
+        if (append && currentNextToken)
+          params.set("token", currentNextToken);
+        const res = await fetch(`/_db/s3/objects?${params}`, {
+          signal: slot.signal
+        });
+        if (disposed || slot.isStale())
+          return;
+        if (!res.ok) {
+          const text2 = await res.text();
+          setPaneStatus(objectList, `Error: ${text2 || res.statusText}`, {
+            error: true
+          });
+          objectStatus.textContent = "";
+          return;
+        }
+        const data = await res.json();
+        if (disposed || slot.isStale() || requestRunId !== loadRunId || requestDbId !== currentDbId || requestBucket !== currentBucket || requestSearch !== currentSearch || requestMode !== currentMode || requestSort !== currentSort) {
+          return;
+        }
+        if (!append)
+          objectList.innerHTML = "";
+        if (data.objects.length === 0 && !append) {
+          setPaneStatus(objectList, data.scanLimitReached ? `(no matches in the first ${data.scannedObjects.toLocaleString()} scanned objects; narrow the prefix and search again)` : "(no objects)");
+        } else {
+          appendObjects(data.objects);
+        }
+        currentNextToken = data.nextToken;
+        moreBtn.hidden = !data.nextToken;
+        setObjectStatusFromResponse(data);
+        highlightActiveObject(currentKey);
+      } catch (err) {
+        if (slot.isStale())
+          return;
+        setPaneStatus(objectList, `Error: ${err instanceof Error ? err.message : String(err)}`, { error: true });
+        objectStatus.textContent = "";
+      } finally {
+        slot.finish();
+        if (!slot.isStale())
+          moreBtn.disabled = false;
+      }
+    }
+    function renderPreviewHeader(object) {
+      const header = document.createElement("div");
+      header.className = "s3-preview-header";
+      const title = document.createElement("div");
+      title.className = "s3-preview-title";
+      title.textContent = object.key;
+      title.title = object.key;
+      const meta = document.createElement("div");
+      meta.className = "s3-preview-meta";
+      meta.textContent = [
+        objectTypeLabel(object.key, object.contentType),
+        formatBytes(object.sizeBytes),
+        formatFileDate(object.updatedAt)
+      ].filter(Boolean).join(" / ");
+      const actions = document.createElement("div");
+      actions.className = "s3-preview-actions";
+      if (currentDbId && currentBucket) {
+        const rawUrl = buildS3RawUrl(currentDbId, currentBucket, object.key);
+        const open = document.createElement("a");
+        open.className = "db-btn db-btn-sm";
+        open.href = rawUrl;
+        open.target = "_blank";
+        open.rel = "noreferrer";
+        open.textContent = "Open raw";
+        const download = document.createElement("a");
+        download.className = "db-btn db-btn-sm";
+        download.href = rawUrl;
+        download.download = s3ObjectName(object.key);
+        download.textContent = "Download";
+        const copy = document.createElement("button");
+        copy.type = "button";
+        copy.className = "db-btn db-btn-sm";
+        copy.textContent = "Copy S3 URI";
+        copy.addEventListener("click", async () => {
+          try {
+            await navigator.clipboard.writeText(s3Uri(currentBucket || "", object.key));
+            copy.textContent = "Copied";
+            window.setTimeout(() => {
+              copy.textContent = "Copy S3 URI";
+            }, 1200);
+          } catch {
+            copy.textContent = "Copy failed";
+          }
+        });
+        actions.append(open, download, copy);
+      }
+      header.append(title, meta, actions);
+      return header;
+    }
+    function renderMediaPreview(object, kind) {
+      const view = document.createElement("div");
+      view.className = `gdp-source-viewer media ${kind} s3-source-preview`;
+      if (!currentDbId || !currentBucket)
+        return view;
+      const url = buildS3RawUrl(currentDbId, currentBucket, object.key);
+      appendMediaEmbed(view, { url, kind, title: object.key });
+      return view;
+    }
+    function renderUnsupported() {
+      return renderUnsupportedPreview({
+        className: "s3-source-preview",
+        message: "This object type cannot be previewed safely in the browser."
+      });
+    }
+    async function renderTextPreview(object, slot) {
+      if (!currentDbId || !currentBucket)
+        return null;
+      const params = new URLSearchParams({
+        db: currentDbId,
+        bucket: currentBucket,
+        key: object.key
+      });
+      const res = await fetch(`/_db/s3/text?${params}`, { signal: slot.signal });
+      if (disposed || slot.isStale())
+        return null;
+      if (!res.ok) {
+        const text2 = await res.text();
+        const error2 = document.createElement("div");
+        error2.className = "db-pane-error";
+        error2.textContent = text2 || res.statusText;
+        return error2;
+      }
+      const data = await res.json();
+      if (disposed || slot.isStale())
+        return null;
+      const previewKind = sourcePreviewKind(object.key);
+      let body;
+      if (previewKind === "html") {
+        body = renderHtmlPreviewFrame(`${object.key} preview`, data.text, "s3-html-preview");
+      } else if (previewKind === "markdown") {
+        body = await renderMarkdownPreview(data.text, { path: object.key, ref: "s3" }, {
+          syntaxHighlight: true,
+          signal: slot.signal,
+          resolveAssetUrl: (path) => currentDbId && currentBucket ? buildS3RawUrl(currentDbId, currentBucket, path) : null
+        });
+      } else {
+        const pre = document.createElement("pre");
+        pre.className = "s3-text-preview";
+        pre.textContent = data.text;
+        body = pre;
+      }
+      if (data.truncated) {
+        const wrap = document.createElement("div");
+        wrap.className = "s3-text-preview-wrap";
+        const note = document.createElement("div");
+        note.className = "datastore-value-truncation";
+        note.textContent = `Showing first ${formatBytes(512 * 1024)}.`;
+        wrap.append(note, body);
+        return wrap;
+      }
+      return body;
+    }
+    async function selectObject(object) {
+      if (disposed || !currentDbId || !currentBucket)
+        return;
+      const slot = previewGuard.start();
+      const requestRunId = ++objectRunId;
+      const requestDbId = currentDbId;
+      const requestBucket = currentBucket;
+      currentKey = object.key;
+      notifySelectionChange();
+      highlightActiveObject(object.key);
+      previewPane.innerHTML = "";
+      previewPane.appendChild(renderPreviewHeader(object));
+      const body = document.createElement("div");
+      body.className = "s3-preview-body";
+      setPaneStatus(body, "Loading preview...");
+      previewPane.appendChild(body);
+      try {
+        const displayKind = sourceDisplayKind(object.key);
+        let preview;
+        if (displayKind === "image" || displayKind === "video" || displayKind === "audio" || displayKind === "pdf") {
+          preview = renderMediaPreview(object, displayKind);
+        } else if (displayKind === "text") {
+          preview = await renderTextPreview(object, slot);
+        } else {
+          preview = renderUnsupported();
+        }
+        if (disposed || slot.isStale() || requestRunId !== objectRunId || requestDbId !== currentDbId || requestBucket !== currentBucket || object.key !== currentKey) {
+          return;
+        }
+        body.innerHTML = "";
+        if (preview)
+          body.appendChild(preview);
+      } catch (err) {
+        if (slot.isStale())
+          return;
+        setPaneStatus(body, `Error: ${err instanceof Error ? err.message : String(err)}`, { error: true });
+      } finally {
+        slot.finish();
+      }
+    }
+    async function selectBucket(bucket) {
+      if (disposed || !currentDbId)
+        return;
+      currentBucket = bucket;
+      currentKey = null;
+      currentNextToken = undefined;
+      notifySelectionChange();
+      await loadObjects(false);
+    }
+    bucketSelect.addEventListener("change", () => {
+      if (bucketSelect.value)
+        selectBucket(bucketSelect.value);
+    });
+    prefixModeBtn.addEventListener("click", () => {
+      setMode("prefix");
+      notifySelectionChange();
+      loadObjects(false);
+    });
+    containsModeBtn.addEventListener("click", () => {
+      setMode("contains");
+      notifySelectionChange();
+      loadObjects(false);
+    });
+    sortSelect.addEventListener("change", () => {
+      currentSort = sortSelect.value === "key-asc" ? "key-asc" : "updated-desc";
+      notifySelectionChange();
+      loadObjects(false);
+    });
+    searchRow.addEventListener("submit", (e2) => {
+      e2.preventDefault();
+      currentSearch = searchInput.value.trim();
+      notifySelectionChange();
+      loadObjects(false);
+    });
+    searchInput.addEventListener("keydown", (e2) => {
+      if (isImeComposing(e2))
+        return;
+      if (e2.key === "Escape") {
+        searchInput.value = "";
+        currentSearch = "";
+        notifySelectionChange();
+        loadObjects(false);
+      }
+    });
+    moreBtn.addEventListener("click", () => loadObjects(true));
+    objectList.addEventListener("click", (e2) => {
+      const row = e2.target?.closest(".s3-object-item");
+      if (!row || !objectList.contains(row))
+        return;
+      const key = row.dataset.key;
+      if (!key)
+        return;
+      const object = objectsByKey.get(key);
+      if (object)
+        selectObject(object);
+    });
+    async function load(dbId, initial) {
+      if (disposed)
+        return;
+      if (currentDbId === dbId && !initial)
+        return;
+      bucketGuard.dispose();
+      objectGuard.dispose();
+      previewGuard.dispose();
+      const slot = bucketGuard.start();
+      const requestRunId = ++loadRunId;
+      const initialMode = initial?.mode === "contains" ? "contains" : "prefix";
+      currentDbId = dbId;
+      currentBucket = null;
+      currentKey = null;
+      currentSearch = initialMode === "contains" ? initial?.query ?? "" : initial?.prefix ?? "";
+      currentSort = initial?.sort === "key-asc" ? "key-asc" : "updated-desc";
+      setMode(initialMode);
+      sortSelect.value = currentSort;
+      searchInput.value = currentSearch;
+      objectStatus.textContent = "";
+      objectList.innerHTML = "";
+      objectsByKey.clear();
+      objectRowsByKey.clear();
+      activeObjectRow = null;
+      moreBtn.hidden = true;
+      previewPane.textContent = "Select an object to preview.";
+      setPaneStatus(objectList, "Loading buckets...");
+      try {
+        const res = await fetch(`/_db/s3/buckets?db=${encodeURIComponent(dbId)}`, { signal: slot.signal });
+        if (disposed || slot.isStale())
+          return;
+        if (!res.ok) {
+          const text2 = await res.text();
+          setPaneStatus(objectList, `Error: ${text2 || res.statusText}`, {
+            error: true
+          });
+          return;
+        }
+        const data = await res.json();
+        if (disposed || slot.isStale() || requestRunId !== loadRunId || currentDbId !== dbId) {
+          return;
+        }
+        renderBuckets(data.buckets);
+        const selected = initial?.bucket && data.buckets.some((bucket) => bucket.name === initial.bucket) && initial.bucket || data.buckets[0]?.name || null;
+        if (!selected) {
+          setPaneStatus(objectList, "(no buckets)");
+          return;
+        }
+        bucketSelect.value = selected;
+        suppressNotify = true;
+        try {
+          currentBucket = selected;
+          currentKey = null;
+          currentNextToken = undefined;
+          notifySelectionChange();
+          highlightActiveObject(null);
+          const headPromise = initial?.key ? fetchObjectHeadForSelection(initial.key, slot.signal).catch(() => null) : null;
+          await loadObjects(false);
+          if (currentDbId !== dbId)
+            return;
+          if (initial?.key) {
+            const object = objectsByKey.get(initial.key) || (headPromise ? await headPromise : null) || { key: initial.key, sizeBytes: 0 };
+            await selectObject(object);
+          }
+        } finally {
+          suppressNotify = false;
+        }
+        notifySelectionChange();
+      } catch (err) {
+        if (slot.isStale())
+          return;
+        setPaneStatus(objectList, `Error: ${err instanceof Error ? err.message : String(err)}`, { error: true });
+      } finally {
+        slot.finish();
+      }
+    }
+    function clear() {
+      bucketGuard.dispose();
+      objectGuard.dispose();
+      previewGuard.dispose();
+      loadRunId++;
+      objectRunId++;
+      suppressNotify = false;
+      currentDbId = null;
+      currentBucket = null;
+      currentKey = null;
+      currentSearch = "";
+      currentNextToken = undefined;
+      currentSort = "updated-desc";
+      setMode("prefix");
+      sortSelect.value = "updated-desc";
+      searchInput.value = "";
+      bucketSelect.innerHTML = "";
+      objectStatus.textContent = "";
+      objectList.innerHTML = "";
+      objectsByKey.clear();
+      objectRowsByKey.clear();
+      activeObjectRow = null;
+      moreBtn.hidden = true;
+      previewPane.textContent = "Select an object to preview.";
+    }
+    function getSelection() {
+      return {
+        bucket: currentBucket ?? undefined,
+        ...currentMode === "prefix" ? { prefix: currentSearch || undefined } : { query: currentSearch || undefined },
+        mode: currentMode,
+        sort: currentSort,
+        key: currentKey ?? undefined
+      };
+    }
+    function dispose() {
+      disposed = true;
+      clear();
+    }
+    setMode("prefix");
+    return { el: container, load, clear, dispose, getSelection };
+  }
+
   // web-src/views/database/schema-view.ts
   function createSchemaView() {
     const el = document.createElement("div");
@@ -11546,6 +12340,7 @@ ${frontmatter.yaml}
     let pageCache = new Map;
     let pendingPages = new Map;
     let loadGeneration = 0;
+    let loadController = new AbortController;
     let rafId = 0;
     let statusEl = null;
     let filterTimer = null;
@@ -11646,10 +12441,18 @@ ${frontmatter.yaml}
       detailPanel.hidden = true;
       detailPanel.innerHTML = "";
     }
+    function startNewLoadGeneration() {
+      loadController.abort("db-grid:generation");
+      loadController = new AbortController;
+      loadGeneration++;
+    }
+    function isAbortError(err) {
+      return err instanceof DOMException && err.name === "AbortError" || err instanceof Error && err.name === "AbortError";
+    }
     function invalidateData() {
       pageCache = new Map;
       pendingPages = new Map;
-      loadGeneration++;
+      startNewLoadGeneration();
       viewport.scrollTop = 0;
       resetSelectionAndDetail();
       return ensurePage(0);
@@ -11668,7 +12471,7 @@ ${frontmatter.yaml}
       filterRow.innerHTML = "";
       pageCache = new Map;
       pendingPages = new Map;
-      loadGeneration++;
+      startNewLoadGeneration();
       cancelAnimationFrame(rafId);
       if (filterTimer)
         clearTimeout(filterTimer);
@@ -11881,6 +12684,7 @@ ${frontmatter.yaml}
       }
       pageCache = new Map;
       pendingPages = new Map;
+      startNewLoadGeneration();
       resetSelectionAndDetail();
       renderHeader();
       renderViewport();
@@ -11892,8 +12696,9 @@ ${frontmatter.yaml}
       if (pending)
         return pending;
       const gen = loadGeneration;
+      const signal = loadController.signal;
       const filters = collectFilters();
-      const promise = callbacks.fetchPage(currentTable, pageStart, PAGE_SIZE, sort, filters).then((data) => {
+      const promise = callbacks.fetchPage(currentTable, pageStart, PAGE_SIZE, sort, filters, signal).then((data) => {
         if (gen !== loadGeneration)
           return;
         pageCache.set(pageStart, data.rows);
@@ -11902,6 +12707,8 @@ ${frontmatter.yaml}
         updateStatus();
         renderViewport();
       }).catch((err) => {
+        if (gen !== loadGeneration || isAbortError(err))
+          return;
         if (gen === loadGeneration) {
           showError(err instanceof Error ? err.message : String(err));
         }
@@ -12429,6 +13236,9 @@ ${frontmatter.yaml}
   function errorMessage(err) {
     return err instanceof Error ? err.message : String(err);
   }
+  function isAbortError(err) {
+    return err instanceof DOMException && err.name === "AbortError" || err instanceof Error && err.name === "AbortError";
+  }
   function isSqlKind(kind) {
     return kind === "sqlite" || kind === "postgresql" || kind === "mysql";
   }
@@ -12438,6 +13248,8 @@ ${frontmatter.yaml}
   function isSqlView(view) {
     return view === "data" || view === "query" || view === "schema" || view === "er" || view === "search" || view === "snapshot";
   }
+  var HISTORY_SSE_REFRESH_DELAY_MS = 250;
+  var TABLE_SELECT_FETCH_DELAY_MS = 50;
   function computeVisibility(kind, tab, userPrefersHistoryOpen) {
     const sqlMode = isSqlKind(kind);
     const tableScopedTab = tab === "data" || tab === "schema";
@@ -12456,7 +13268,8 @@ ${frontmatter.yaml}
       searchHidden: !sqlMode || tab !== "search",
       snapshotHidden: !sqlMode || tab !== "snapshot",
       redisHidden: kind !== "redis",
-      esHidden: kind !== "elasticsearch"
+      esHidden: kind !== "elasticsearch",
+      s3Hidden: kind !== "s3"
     };
   }
   function normalizeViewForDb(view, db) {
@@ -12491,9 +13304,11 @@ ${frontmatter.yaml}
     let currentSchema = initial.schema ?? null;
     let currentTable = initial.table ?? null;
     let loadGeneration = 0;
+    const tableSelectGuard = createAbortGuard();
+    let historyRefreshPending = null;
     const dbSelect = document.createElement("select");
     dbSelect.className = "db-file-select";
-    dbSelect.title = "Select database file";
+    dbSelect.title = "Select datastore";
     const schemaSelect = document.createElement("select");
     schemaSelect.className = "db-file-select db-schema-select";
     schemaSelect.title = "Select PostgreSQL schema";
@@ -12506,7 +13321,7 @@ ${frontmatter.yaml}
     const tabData = createInnerTab("Data", true);
     const tabSchema = createInnerTab("Schema", false);
     tabBar.append(tabData, tabSchema);
-    let currentTab = "data";
+    let currentTab = initial.view ?? "data";
     const tableList = createTableList({
       onSelectTable: (table2) => selectTable(table2),
       onViewCreateTable: (table2) => showDdl(table2),
@@ -12520,7 +13335,7 @@ ${frontmatter.yaml}
     const toolsSection = document.createElement("div");
     toolsSection.className = "db-icon-toolbar";
     toolsSection.setAttribute("role", "toolbar");
-    toolsSection.setAttribute("aria-label", "Database tools");
+    toolsSection.setAttribute("aria-label", "Datastore tools");
     const queryBtn = makeIconButton({
       label: "Query",
       title: "Query Editor",
@@ -12579,7 +13394,7 @@ ${frontmatter.yaml}
       window.addEventListener("mouseup", onUp);
     });
     const grid = createTableGrid({
-      fetchPage: (table2, offset, limit, sort, filters) => fetchTablePage(table2, offset, limit, sort, filters),
+      fetchPage: (table2, offset, limit, sort, filters, signal) => fetchTablePage(table2, offset, limit, sort, filters, signal),
       getDbId: () => currentDbInfo?.id || null
     });
     const queryEditor = createQueryEditor({
@@ -12615,9 +13430,13 @@ ${frontmatter.yaml}
       onSelectionChange: () => cb.onStateChange()
     });
     esExplorer.el.hidden = true;
+    const s3Explorer = createS3Explorer({
+      onSelectionChange: () => cb.onStateChange()
+    });
+    s3Explorer.el.hidden = true;
     const mainContent = document.createElement("div");
     mainContent.className = "db-main-content";
-    mainContent.append(tabBar, grid.el, queryEditor.el, schemaView.el, erDiagram.el, globalSearchView.el, snapshotView.el, redisExplorer.el, esExplorer.el);
+    mainContent.append(tabBar, grid.el, queryEditor.el, schemaView.el, erDiagram.el, globalSearchView.el, snapshotView.el, redisExplorer.el, esExplorer.el, s3Explorer.el);
     queryEditor.el.hidden = true;
     globalSearchView.el.hidden = true;
     snapshotView.el.hidden = true;
@@ -12679,6 +13498,7 @@ ${frontmatter.yaml}
       snapshotView.el.hidden = visibility.snapshotHidden;
       redisExplorer.el.hidden = visibility.redisHidden;
       esExplorer.el.hidden = visibility.esHidden;
+      s3Explorer.el.hidden = visibility.s3Hidden;
       if (!sqlMode) {
         queryBtn.classList.remove("active");
         erBtn.classList.remove("active");
@@ -12686,7 +13506,7 @@ ${frontmatter.yaml}
         snapshotBtn.classList.remove("active");
       }
       historyToggle.classList.toggle("active", userPrefersHistoryOpen);
-      if (!visibility.historyPaneHidden)
+      if (!visibility.historyPaneHidden && cb.isActive())
         historyView.refresh();
     }
     applyVisibility();
@@ -12723,6 +13543,33 @@ ${frontmatter.yaml}
       if (list2)
         setPaneStatus(list2, message, options);
     }
+    function waitForTableSelectFetch(signal) {
+      if (signal.aborted) {
+        return Promise.reject(new DOMException("aborted", "AbortError"));
+      }
+      return new Promise((resolve, reject) => {
+        let done = false;
+        const cleanup = () => {
+          signal.removeEventListener("abort", onAbort);
+        };
+        const timer = setTimeout(() => {
+          if (done)
+            return;
+          done = true;
+          cleanup();
+          resolve();
+        }, TABLE_SELECT_FETCH_DELAY_MS);
+        const onAbort = () => {
+          if (done)
+            return;
+          done = true;
+          clearTimeout(timer);
+          cleanup();
+          reject(new DOMException("aborted", "AbortError"));
+        };
+        signal.addEventListener("abort", onAbort, { once: true });
+      });
+    }
     function setActiveTab(tab, updateUrl = true) {
       currentTab = normalizeViewForDb(tab, currentDbInfo);
       const tableScopedTab = currentTab === "data" || currentTab === "schema";
@@ -12758,6 +13605,8 @@ ${frontmatter.yaml}
         showSchema(active.dataset.table);
     });
     async function fetchDbFiles() {
+      if (deps.fetchDbFiles)
+        return deps.fetchDbFiles();
       const res = await deps.trackLoad(fetch("/_db/files"));
       if (!res.ok)
         return { files: [] };
@@ -12803,7 +13652,7 @@ ${frontmatter.yaml}
       }
       return await res.json();
     }
-    async function fetchTablePage(table2, offset, limit, sort, filters) {
+    async function fetchTablePage(table2, offset, limit, sort, filters, signal) {
       if (!currentDbInfo)
         throw new Error("no database selected");
       const params = new URLSearchParams({
@@ -12820,7 +13669,7 @@ ${frontmatter.yaml}
       if (filters.length > 0) {
         params.set("filters", JSON.stringify(filters));
       }
-      const res = await fetch(`/_db/table?${params}`);
+      const res = await fetch(`/_db/table?${params}`, signal ? { signal } : undefined);
       if (!res.ok) {
         throw new Error(await responseErrorMessage(res, "failed to fetch table"));
       }
@@ -12848,15 +13697,14 @@ ${frontmatter.yaml}
         throw new Error(await responseErrorMessage(res, "failed to execute query"));
       }
       const result = await res.json();
-      if (userPrefersHistoryOpen)
-        historyView.refresh();
       return result;
     }
-    async function selectDb(dbId, explorerInitial, generation = loadGeneration, preferredSchema, preferredTable) {
+    async function selectDb(dbId, explorerInitial, generation = loadGeneration, preferredSchema, preferredTable, targetView) {
       if (generation !== loadGeneration || currentDbInfo?.id !== dbId)
         return;
+      tableSelectGuard.dispose();
       currentTable = null;
-      if (currentDbInfo?.kind === "redis" || currentDbInfo?.kind === "elasticsearch") {
+      if (currentDbInfo?.kind === "redis" || currentDbInfo?.kind === "elasticsearch" || currentDbInfo?.kind === "s3") {
         currentSchema = null;
         renderSchemaOptions([], null);
         currentTab = "data";
@@ -12868,10 +13716,16 @@ ${frontmatter.yaml}
         applyVisibility();
         if (currentDbInfo.kind === "redis") {
           esExplorer.clear();
+          s3Explorer.clear();
           await redisExplorer.load(dbId, explorerInitial?.redis);
-        } else {
+        } else if (currentDbInfo.kind === "elasticsearch") {
           redisExplorer.clear();
+          s3Explorer.clear();
           await esExplorer.load(dbId, explorerInitial?.es);
+        } else {
+          redisExplorer.clear();
+          esExplorer.clear();
+          await s3Explorer.load(dbId, explorerInitial?.s3);
         }
         if (generation !== loadGeneration || currentDbInfo?.id !== dbId)
           return;
@@ -12880,6 +13734,7 @@ ${frontmatter.yaml}
       }
       redisExplorer.clear();
       esExplorer.clear();
+      s3Explorer.clear();
       applyVisibility();
       tableList.render([]);
       setTableListStatus("Loading schema...");
@@ -12936,10 +13791,13 @@ ${frontmatter.yaml}
       grid.clear();
       schemaView.clear();
       erDiagram.clear();
-      setActiveTab("data", false);
+      const normalizedTargetView = normalizeViewForDb(targetView, currentDbInfo);
+      setActiveTab(normalizedTargetView === "schema" ? "schema" : "data", false);
       const initialTable = preferredTable || schema.tables[0]?.name;
-      if (initialTable) {
+      if (initialTable && normalizedTargetView === "data") {
         await selectTable(initialTable, generation);
+      } else if (initialTable && normalizedTargetView === "schema") {
+        await selectTableSchemaOnly(initialTable, generation);
       }
       applyVisibility();
       cb.onStateChange();
@@ -12947,6 +13805,7 @@ ${frontmatter.yaml}
     async function selectTable(table2, generation = loadGeneration) {
       if (generation !== loadGeneration)
         return;
+      const slot = tableSelectGuard.start();
       currentTable = table2;
       tableList.setActive(table2);
       if (!currentDbInfo)
@@ -12964,16 +13823,22 @@ ${frontmatter.yaml}
         range: deps.currentRange()
       }, true);
       try {
-        const data = await deps.trackLoad(fetchTablePage(table2, 0, 200, null, []));
-        if (generation !== loadGeneration || currentDbInfo?.id !== requestDbId || currentTable !== table2) {
+        await waitForTableSelectFetch(slot.signal);
+        if (slot.isStale() || generation !== loadGeneration || currentDbInfo?.id !== requestDbId || currentTable !== table2) {
+          return;
+        }
+        const data = await deps.trackLoad(fetchTablePage(table2, 0, 200, null, [], slot.signal));
+        if (slot.isStale() || generation !== loadGeneration || currentDbInfo?.id !== requestDbId || currentTable !== table2) {
           return;
         }
         grid.load(table2, data);
       } catch (err) {
-        if (generation !== loadGeneration || currentDbInfo?.id !== requestDbId || currentTable !== table2) {
+        if (slot.isStale() || isAbortError(err) || generation !== loadGeneration || currentDbInfo?.id !== requestDbId || currentTable !== table2) {
           return;
         }
         grid.showError(errorMessage(err));
+      } finally {
+        slot.finish();
       }
       if (currentTab === "schema") {
         const columns = await fetchColumns(table2);
@@ -12983,6 +13848,21 @@ ${frontmatter.yaml}
         schemaView.render(table2, columns, schemaCache?.indexes || []);
       }
     }
+    async function selectTableSchemaOnly(table2, generation = loadGeneration) {
+      if (generation !== loadGeneration)
+        return;
+      currentTable = table2;
+      tableList.setActive(table2);
+      if (!currentDbInfo)
+        return;
+      const requestDbId = currentDbInfo.id;
+      setActiveTab("schema", false);
+      const columns = await fetchColumns(table2);
+      if (generation !== loadGeneration || currentDbInfo?.id !== requestDbId || currentTable !== table2) {
+        return;
+      }
+      schemaView.render(table2, columns, schemaCache?.indexes || []);
+    }
     async function fetchColumns(table2) {
       if (schemaCache?.columnsMap?.[table2]) {
         return schemaCache.columnsMap[table2];
@@ -13098,6 +13978,7 @@ ${frontmatter.yaml}
     }
     let pendingRedisInitial = initial.redis;
     let pendingEsInitial = initial.es;
+    let pendingS3Initial = initial.s3;
     async function enter(db, schema, table2, view, options = {}) {
       const generation = ++loadGeneration;
       const filesResponse = await fetchDbFiles();
@@ -13114,21 +13995,23 @@ ${frontmatter.yaml}
       if (files.length === 0) {
         const opt = document.createElement("option");
         opt.value = "";
-        opt.textContent = "No database files found";
+        opt.textContent = "No datastores found";
         dbSelect.appendChild(opt);
         dbSelect.disabled = true;
         cb.onStateChange();
         return;
       }
       dbSelect.disabled = false;
+      const optionsFragment = document.createDocumentFragment();
       for (const f2 of files) {
         const opt = document.createElement("option");
         opt.value = f2.id;
         const isDocker = f2.id.startsWith("docker:");
         const label = isDocker ? `${f2.name} (Docker)` : `${f2.path} (${formatSize(f2.sizeBytes)})`;
         opt.textContent = label;
-        dbSelect.appendChild(opt);
+        optionsFragment.appendChild(opt);
       }
+      dbSelect.appendChild(optionsFragment);
       const autoSelectFirst = options.autoSelectFirst ?? true;
       if (db && !files.find((f2) => f2.id === db)) {
         db = autoSelectFirst ? files[0].id : null;
@@ -13146,6 +14029,7 @@ ${frontmatter.yaml}
         erDiagram.clear();
         redisExplorer.clear();
         esExplorer.clear();
+        s3Explorer.clear();
         setActiveTab("data", false);
         cb.onStateChange();
         return;
@@ -13155,14 +14039,16 @@ ${frontmatter.yaml}
       currentDbInfo = files.find((f2) => f2.id === target) || null;
       const explorerInitial = {
         redis: pendingRedisInitial,
-        es: pendingEsInitial
+        es: pendingEsInitial,
+        s3: pendingS3Initial
       };
       pendingRedisInitial = undefined;
       pendingEsInitial = undefined;
-      await selectDb(target, explorerInitial, generation, schema !== undefined ? schema : currentSchema, table2);
+      pendingS3Initial = undefined;
+      await selectDb(target, explorerInitial, generation, schema !== undefined ? schema : currentSchema, table2, view);
       if (generation !== loadGeneration || currentDbInfo?.id !== target)
         return;
-      if (currentDbInfo?.kind === "redis" || currentDbInfo?.kind === "elasticsearch") {
+      if (currentDbInfo?.kind === "redis" || currentDbInfo?.kind === "elasticsearch" || currentDbInfo?.kind === "s3") {
         cb.onStateChange();
         return;
       }
@@ -13219,20 +14105,28 @@ ${frontmatter.yaml}
       }
     }
     function handleSse(event, data) {
-      if (userPrefersHistoryOpen)
-        historyView.refresh();
+      if (userPrefersHistoryOpen && cb.isActive()) {
+        if (historyRefreshPending !== null)
+          clearTimeout(historyRefreshPending);
+        historyRefreshPending = setTimeout(() => {
+          historyRefreshPending = null;
+          if (userPrefersHistoryOpen && cb.isActive()) {
+            historyView.refresh({ force: true });
+          }
+        }, HISTORY_SSE_REFRESH_DELAY_MS);
+      }
       if (event === "db-snapshot" && data) {
         snapshotView.handleSse(data);
       }
     }
     function getState() {
-      const activeTable = tableList.el.querySelector(".db-table-item.active");
+      const loaded = !!currentDbInfo;
       const state = {
         id: cb.tabId,
-        dbId: currentDbInfo?.id ?? null,
-        schema: currentSchema,
-        table: currentTable ?? activeTable?.dataset.table ?? null,
-        view: currentTab
+        dbId: currentDbInfo?.id ?? initial.dbId ?? null,
+        schema: loaded ? currentSchema : initial.schema ?? currentSchema,
+        table: loaded ? currentTable : initial.table ?? currentTable ?? null,
+        view: loaded ? currentTab : initial.view ?? currentTab
       };
       const sqlDraft = queryEditor.getSql();
       if (sqlDraft)
@@ -13243,7 +14137,14 @@ ${frontmatter.yaml}
         state.historyHeight = historyPane.style.height;
       if (sidebar.style.width)
         state.sidebarWidth = sidebar.style.width;
-      if (currentDbInfo?.kind === "redis") {
+      if (!loaded) {
+        if (initial.redis)
+          state.redis = initial.redis;
+        if (initial.es)
+          state.es = initial.es;
+        if (initial.s3)
+          state.s3 = initial.s3;
+      } else if (currentDbInfo?.kind === "redis") {
         const sel = redisExplorer.getSelection();
         if (sel.dbIndex !== undefined || sel.key !== undefined || sel.keyFilter !== undefined) {
           state.redis = sel;
@@ -13253,6 +14154,11 @@ ${frontmatter.yaml}
         if (sel.index !== undefined || sel.query !== undefined) {
           state.es = sel;
         }
+      } else if (currentDbInfo?.kind === "s3") {
+        const sel = s3Explorer.getSelection();
+        if (sel.bucket !== undefined || sel.prefix !== undefined || sel.query !== undefined || sel.key !== undefined || sel.mode !== "prefix" || sel.sort !== "updated-desc") {
+          state.s3 = sel;
+        }
       }
       return state;
     }
@@ -13290,6 +14196,11 @@ ${frontmatter.yaml}
     }
     function dispose() {
       loadGeneration++;
+      tableSelectGuard.dispose();
+      if (historyRefreshPending !== null) {
+        clearTimeout(historyRefreshPending);
+        historyRefreshPending = null;
+      }
       grid.destroy();
       schemaView.clear();
       erDiagram.dispose();
@@ -13300,6 +14211,7 @@ ${frontmatter.yaml}
       historyView.clear();
       redisExplorer.dispose();
       esExplorer.dispose();
+      s3Explorer.dispose();
       currentDbInfo = null;
       currentSchema = null;
       currentTable = null;
@@ -13343,6 +14255,7 @@ ${frontmatter.yaml}
     let mounted = false;
     const tabsById = new Map;
     const paneReadyById = new Map;
+    const lazyInitialById = new Map;
     let activeTabId = null;
     let draggingTabId = null;
     let dropTargetId = null;
@@ -13350,9 +14263,40 @@ ${frontmatter.yaml}
     let restoring = false;
     let savePending = null;
     let saveChain = Promise.resolve();
+    let lastSavedTabsRaw = null;
+    let pendingSavedTabsRaw = null;
+    let saveController = null;
     let lifecycleSeq = 0;
     let enterQueue = Promise.resolve();
     let unloadListenerInstalled = false;
+    let dbFilesCache = null;
+    function fetchDbFilesCached() {
+      const now = Date.now();
+      if (dbFilesCache?.value && dbFilesCache.expiresAt > now) {
+        return Promise.resolve(dbFilesCache.value);
+      }
+      if (dbFilesCache?.promise)
+        return dbFilesCache.promise;
+      const promise = deps.trackLoad(fetch("/_db/files")).then(async (res) => {
+        if (!res.ok) {
+          const value2 = { files: [] };
+          dbFilesCache = { value: value2, expiresAt: Date.now() + 1e4 };
+          return value2;
+        }
+        const value = await res.json();
+        dbFilesCache = { value, expiresAt: Date.now() + 1e4 };
+        return value;
+      }).catch(() => {
+        const value = { files: [] };
+        dbFilesCache = { value, expiresAt: Date.now() + 1e4 };
+        return value;
+      }).finally(() => {
+        if (dbFilesCache?.promise === promise)
+          dbFilesCache = null;
+      });
+      dbFilesCache = { promise };
+      return promise;
+    }
     function scheduleSave() {
       if (!mounted || restoring)
         return;
@@ -13360,6 +14304,10 @@ ${frontmatter.yaml}
         clearTimeout(savePending);
       savePending = setTimeout(saveNow, 500);
     }
+    function abortActiveSave() {
+      saveController?.abort();
+      saveController = null;
+    }
     async function saveNow(options = {}) {
       savePending = null;
       if (!mounted || restoring)
@@ -13372,7 +14320,33 @@ ${frontmatter.yaml}
         return;
       const body = { version: 1, tabs, activeTabId };
       const raw = JSON.stringify(body);
+      if (raw === lastSavedTabsRaw)
+        return;
+      if (!options.keepalive && raw === pendingSavedTabsRaw)
+        return;
+      pendingSavedTabsRaw = raw;
+      abortActiveSave();
+      if (options.keepalive) {
+        try {
+          await fetch("/_db/tabs", {
+            method: "PUT",
+            headers: {
+              "Content-Type": "application/json",
+              "X-Code-Viewer-Action": "1"
+            },
+            body: raw,
+            keepalive: true
+          });
+          lastSavedTabsRaw = raw;
+        } catch {} finally {
+          if (pendingSavedTabsRaw === raw)
+            pendingSavedTabsRaw = null;
+        }
+        return;
+      }
       saveChain = saveChain.catch(() => {}).then(async () => {
+        const controller = new AbortController;
+        saveController = controller;
         try {
           await fetch("/_db/tabs", {
             method: "PUT",
@@ -13381,9 +14355,17 @@ ${frontmatter.yaml}
               "X-Code-Viewer-Action": "1"
             },
             body: raw,
-            keepalive: options.keepalive
+            signal: controller.signal
           });
-        } catch {}
+          lastSavedTabsRaw = raw;
+        } catch (err) {
+          if (!isAbortError(err)) {}
+        } finally {
+          if (saveController === controller)
+            saveController = null;
+          if (pendingSavedTabsRaw === raw)
+            pendingSavedTabsRaw = null;
+        }
       });
       await saveChain;
     }
@@ -13436,6 +14418,9 @@ ${frontmatter.yaml}
       if (!restoring)
         syncActiveRoute();
       scheduleSave();
+      if (mounted && !restoring) {
+        ensureInitialEnter(id)?.catch(() => {});
+      }
     }
     function syncActiveRoute() {
       if (!activeTabId)
@@ -13472,7 +14457,8 @@ ${frontmatter.yaml}
           table: tab.table,
           view: tab.view,
           redis: tab.redis ?? null,
-          es: tab.es ?? null
+          es: tab.es ?? null,
+          s3: tab.s3 ?? null
         });
         if (seen.has(key))
           continue;
@@ -13687,7 +14673,7 @@ ${frontmatter.yaml}
           closeTab(id);
         }
       });
-      const pane = createTabPane(deps, {
+      const pane = createTabPane({ ...deps, fetchDbFiles: fetchDbFilesCached }, {
         tabId: id,
         isActive: () => activeTabId === id,
         canSyncRoute: () => !restoring,
@@ -13707,13 +14693,15 @@ ${frontmatter.yaml}
         historyHeight: initial?.historyHeight,
         sidebarWidth: initial?.sidebarWidth,
         redis: initial?.redis,
-        es: initial?.es
+        es: initial?.es,
+        s3: initial?.s3
       });
       pane.el.hidden = true;
       tabsList.appendChild(chip);
       tabHost.appendChild(pane.el);
       tabsById.set(id, { pane, chip, label: labelEl, closeBtn });
-      setActive(id);
+      if (options.activate !== false)
+        setActive(id);
       if (!options.deferInitialEnter) {
         startInitialEnter(id, initial, options);
       }
@@ -13739,6 +14727,16 @@ ${frontmatter.yaml}
       paneReadyById.set(id, ready);
       return ready;
     }
+    function ensureInitialEnter(id) {
+      const ready = paneReadyById.get(id);
+      if (ready)
+        return ready;
+      if (!lazyInitialById.has(id))
+        return null;
+      const initial = lazyInitialById.get(id);
+      lazyInitialById.delete(id);
+      return startInitialEnter(id, initial, { autoSelectFirst: false });
+    }
     function closeTab(id) {
       const entry = tabsById.get(id);
       if (!entry)
@@ -13749,6 +14747,7 @@ ${frontmatter.yaml}
       entry.chip.remove();
       tabsById.delete(id);
       paneReadyById.delete(id);
+      lazyInitialById.delete(id);
       closeDbIfUnused(closedDbId);
       if (activeTabId !== id) {
         scheduleSave();
@@ -13798,6 +14797,11 @@ ${frontmatter.yaml}
       for (const [id2, entry] of tabsById) {
         if (routeMatchesState(entry.pane.getState(), db, schema, table2, view)) {
           setActive(id2);
+          const ready2 = ensureInitialEnter(id2);
+          if (ready2)
+            await ready2;
+          if (!mounted)
+            return;
           if (options.annotationTarget) {
             await enterPane(entry.pane, db, schema, table2, view, options);
             if (!mounted)
@@ -13878,8 +14882,6 @@ ${frontmatter.yaml}
           return;
         if (restored && restored.tabs.length > 0) {
           restoring = true;
-          const restoredIds = [];
-          const restoredById = new Map;
           try {
             const restoredTabs = dedupeTabs(restored.tabs);
             for (const t2 of restoredTabs) {
@@ -13887,28 +14889,21 @@ ${frontmatter.yaml}
                 return;
               const id = openTab(t2, {
                 autoSelectFirst: false,
-                deferInitialEnter: true
+                deferInitialEnter: true,
+                activate: false
               });
-              restoredIds.push(id);
-              restoredById.set(id, t2);
+              lazyInitialById.set(id, t2);
             }
             const targetId = restored.activeTabId && tabsById.has(restored.activeTabId) ? restored.activeTabId : tabsById.keys().next().value;
             if (targetId)
               setActive(targetId);
             if (targetId) {
-              await startInitialEnter(targetId, restoredById.get(targetId), {
-                autoSelectFirst: false
-              });
+              const ready = ensureInitialEnter(targetId);
+              if (ready)
+                await ready;
             }
             if (!mounted || seq !== lifecycleSeq)
               return;
-            for (const id of restoredIds) {
-              if (id === targetId)
-                continue;
-              startInitialEnter(id, restoredById.get(id), {
-                autoSelectFirst: false
-              }).catch(() => {});
-            }
           } finally {
             restoring = false;
           }
@@ -13977,6 +14972,7 @@ ${frontmatter.yaml}
         entry.pane.dispose();
       }
       tabsById.clear();
+      dbFilesCache = null;
       tabsList.innerHTML = "";
       tabHost.innerHTML = "";
       activeTabId = null;
@@ -15590,12 +16586,12 @@ code-viewer annotate add-db --db app.db --tab query \\
           ]
         },
         database: {
-          nav: "Database",
-          title: "Database Viewer",
-          intro: "Browse SQLite files and Docker-hosted MySQL/PostgreSQL databases. Run queries with syntax highlighting and explore table schemas and ER diagrams.",
+          nav: "Datastores",
+          title: "Datastore Viewer",
+          intro: "Browse SQLite files, Docker-hosted databases, Redis, Elasticsearch, and S3-compatible object stores from one local viewer.",
           groups: [
             {
-              title: "Supported databases",
+              title: "Supported datastores",
               blocks: [
                 {
                   kind: "table",
@@ -15611,6 +16607,10 @@ code-viewer annotate add-db --db app.db --tab query \\
                     [
                       "PostgreSQL",
                       "Detected from docker-compose.yml services. Multiple databases per server are listed."
+                    ],
+                    [
+                      "S3 / MinIO / LocalStack",
+                      "Detected from docker-compose.yml services. Browse buckets, search objects, sort by update time, and preview common file types."
                     ]
                   ]
                 }
@@ -15953,12 +16953,12 @@ code-viewer annotate add-db --db app.db --tab query \\
           ]
         },
         database: {
-          nav: "データベース",
-          title: "データベースビューア",
-          intro: "SQLite ファイルや Docker 上の MySQL/PostgreSQL を閲覧できます。シンタックスハイライト付きクエリ実行、スキーマ表示、ER 図を提供します。",
+          nav: "データストア",
+          title: "データストアビューア",
+          intro: "SQLite ファイル、Docker 上のデータベース、Redis、Elasticsearch、S3 互換オブジェクトストアをローカルビューアで閲覧できます。",
           groups: [
             {
-              title: "対応データベース",
+              title: "対応データストア",
               blocks: [
                 {
                   kind: "table",
@@ -15974,6 +16974,10 @@ code-viewer annotate add-db --db app.db --tab query \\
                     [
                       "PostgreSQL",
                       "docker-compose.yml のサービスから検出。同一サーバー上の複数データベースを一覧表示します。"
+                    ],
+                    [
+                      "S3 / MinIO / LocalStack",
+                      "docker-compose.yml のサービスから検出。バケット閲覧、オブジェクト検索、更新日時順表示、主要ファイル形式のプレビューに対応します。"
                     ]
                   ]
                 }
@@ -16027,7 +17031,7 @@ code-viewer annotate add-db --db app.db --tab query \\
                 },
                 {
                   kind: "command",
-                  title: "データベース一覧",
+                  title: "データストア一覧",
                   command: "code-viewer query list"
                 },
                 {
@@ -18838,7 +19842,7 @@ code-viewer annotate add-db --db app.db --tab query \\
       setRoute,
       currentRange,
       appendScopeParams,
-      isAbortError,
+      isAbortError: isAbortError2,
       scrollToFile,
       applySourceRouteToShell,
       fileSourceTarget,
@@ -19185,7 +20189,7 @@ code-viewer annotate add-db --db app.db --tab query \\
           state.status.textContent = response.engine + (state.grepRegex ? " regex" : " plain") + (response.truncated ? " truncated" : "") + " - " + state.items.length + " results";
           renderPalette(state);
         }).catch((err) => {
-          if (isAbortError(err))
+          if (isAbortError2(err))
             return;
           state.status.textContent = "Search failed";
         });
@@ -20646,7 +21650,7 @@ code-viewer annotate add-db --db app.db --tab query \\
       setPageMode,
       currentRange,
       trackLoad,
-      isAbortError,
+      isAbortError: isAbortError2,
       loadRepo,
       repoRoute,
       repoFileTargetFromRoute,
@@ -20966,16 +21970,6 @@ code-viewer annotate add-db --db app.db --tab query \\
     }
     function renderSourceUnsupported(card, target) {
       const body = card.querySelector(".gdp-file-detail-body, .d2h-files-diff, .d2h-file-diff, .gdp-media, .gdp-source-viewer");
-      const view = document.createElement("div");
-      view.className = "gdp-source-viewer unsupported";
-      const content = document.createElement("div");
-      content.className = "gdp-source-unsupported-content";
-      const title = document.createElement("strong");
-      title.className = "gdp-source-unsupported-title";
-      title.textContent = "Preview unavailable";
-      const message = document.createElement("div");
-      message.className = "gdp-source-unsupported-message";
-      message.textContent = "This file type cannot be previewed safely in the browser.";
       const info = createSourceFileInfo(target, "unsupported file");
       const link2 = document.createElement("a");
       link2.className = "gdp-btn gdp-btn-sm gdp-source-download";
@@ -20983,23 +21977,17 @@ code-viewer annotate add-db --db app.db --tab query \\
       link2.textContent = "Download raw";
       link2.target = "_blank";
       link2.rel = "noreferrer";
-      content.append(title, message, info, link2);
-      view.appendChild(content);
+      const view = renderUnsupportedPreview({
+        message: "This file type cannot be previewed safely in the browser.",
+        extraChildren: [info, link2]
+      });
       if (body)
         body.replaceWith(view);
       else
         card.appendChild(view);
     }
     function renderHtmlPreview(target, html) {
-      const preview = document.createElement("div");
-      preview.className = "gdp-html-preview";
-      const frame = document.createElement("iframe");
-      frame.title = `${target.path} preview`;
-      frame.sandbox.value = "";
-      frame.referrerPolicy = "no-referrer";
-      frame.srcdoc = html;
-      preview.appendChild(frame);
-      return preview;
+      return renderHtmlPreviewFrame(`${target.path} preview`, html);
     }
     function createSourceFileInfo(target, kind) {
       const info = document.createElement("div");
@@ -21696,7 +22684,7 @@ code-viewer annotate add-db --db app.db --tab query \\
           renderedEnd = -1;
           render();
         }).catch((err) => {
-          if (!isAbortError(err)) {
+          if (!isAbortError2(err)) {
             failedPages.add(page);
             renderedStart = -1;
             renderedEnd = -1;
@@ -21888,35 +22876,16 @@ code-viewer annotate add-db --db app.db --tab query \\
       const url = buildRawFileUrl(target);
       const info = createSourceFileInfo(target, mediaKind);
       view.appendChild(info);
-      if (mediaKind === "video") {
-        const video = document.createElement("video");
-        video.src = url;
-        video.controls = true;
-        video.preload = "metadata";
-        view.appendChild(video);
-      } else if (mediaKind === "audio") {
-        const audio = document.createElement("audio");
-        audio.src = url;
-        audio.controls = true;
-        audio.preload = "metadata";
-        view.appendChild(audio);
-      } else if (mediaKind === "pdf") {
-        const frame = document.createElement("iframe");
-        frame.src = url;
-        frame.title = target.path;
-        frame.loading = "lazy";
-        view.appendChild(frame);
-      } else {
-        const img = document.createElement("img");
-        img.src = url;
-        img.alt = "";
-        img.addEventListener("load", () => {
+      appendMediaEmbed(view, {
+        url,
+        kind: mediaKind,
+        title: target.path,
+        onImageLoad: (img) => {
           const resolution = document.createElement("span");
           resolution.textContent = `${img.naturalWidth} x ${img.naturalHeight}`;
           info.appendChild(resolution);
-        }, { once: true });
-        view.appendChild(img);
-      }
+        }
+      });
       if (body)
         body.replaceWith(view);
       else
@@ -22089,7 +23058,7 @@ code-viewer annotate add-db --db app.db --tab query \\
         if (req !== SOURCE_REQ_SEQ || !sourceTargetsEqual(sourceTargetFromRoute(), target))
           return;
         finishSourceLoad(req);
-        if (isAbortError(err)) {
+        if (isAbortError2(err)) {
           renderSourceCancelled(card, target);
           return;
         }
@@ -22612,7 +23581,7 @@ code-viewer annotate add-db --db app.db --tab query \\
       setPageMode,
       currentRange,
       trackLoad,
-      isAbortError,
+      isAbortError: isAbortError2,
       loadRepo: () => REPO_VIEW.loadRepo(),
       repoRoute: (ref, path) => REPO_VIEW.repoRoute(ref, path),
       repoFileTargetFromRoute,
@@ -22696,7 +23665,7 @@ code-viewer annotate add-db --db app.db --tab query \\
       setRoute,
       currentRange,
       appendScopeParams,
-      isAbortError,
+      isAbortError: isAbortError2,
       scrollToFile: (path, line) => DIFF_VIEW.scrollToFile(path, line),
       applySourceRouteToShell,
       fileSourceTarget,
@@ -22712,7 +23681,7 @@ code-viewer annotate add-db --db app.db --tab query \\
           repo: "Repository",
           diff: "Diff Viewer",
           history: "History",
-          database: "Database",
+          database: "Datastores",
           help: "Help"
         },
         global: {
@@ -22772,7 +23741,7 @@ code-viewer annotate add-db --db app.db --tab query \\
           display: "Display",
           language: "Language",
           fileListFontSize: "UI font size",
-          fileListFontSizeHelp: "Applies to the file sidebar and database UI.",
+          fileListFontSizeHelp: "Applies to the file sidebar and datastore UI.",
           codeFontSize: "Code font size",
           sizeSmall: "Small",
           sizeRegular: "Regular",
@@ -22802,7 +23771,7 @@ code-viewer annotate add-db --db app.db --tab query \\
           repo: "リポジトリ",
           diff: "Diff ビューア",
           history: "履歴",
-          database: "データベース",
+          database: "データストア",
           help: "ヘルプ"
         },
         global: {
@@ -22862,7 +23831,7 @@ code-viewer annotate add-db --db app.db --tab query \\
           display: "表示",
           language: "言語",
           fileListFontSize: "UIの文字サイズ",
-          fileListFontSizeHelp: "ファイル一覧とデータベース画面に適用されます。",
+          fileListFontSizeHelp: "ファイル一覧とデータストア画面に適用されます。",
           codeFontSize: "コード表示の文字サイズ",
           sizeSmall: "小",
           sizeRegular: "標準",
@@ -23279,7 +24248,7 @@ code-viewer annotate add-db --db app.db --tab query \\
         "'": "&#39;"
       })[c2]);
     }
-    function isAbortError(err) {
+    function isAbortError2(err) {
       return err instanceof DOMException ? err.name === "AbortError" : !!err && typeof err === "object" && ("name" in err) && err.name === "AbortError";
     }
     function currentRange() {