gemstar 1.2 → 1.3

data/lib/gemstar/web/templates/app.css

@@ -8,6 +8,7 @@
         --line: #ddcfbf;
         --accent: #b44d25;
         --accent-soft: rgba(180, 77, 37, 0.14);
+        --focus: #2563c9;
         --green: #2f8f5b;
         --green-soft: rgba(47, 143, 91, 0.12);
         --red: #a9473c;
@@ -182,6 +183,63 @@
         opacity: 0.55;
         cursor: not-allowed;
       }
+      .command-dialog-backdrop {
+        position: fixed;
+        inset: 0;
+        z-index: 20;
+        display: grid;
+        place-items: center;
+        padding: 1rem;
+        background: rgba(31, 27, 23, 0.42);
+      }
+      .command-dialog {
+        width: min(48rem, 100%);
+        max-height: min(42rem, calc(100vh - 2rem));
+        display: grid;
+        grid-template-rows: auto minmax(10rem, 1fr) auto;
+        overflow: hidden;
+        border: 1px solid var(--line);
+        border-radius: 0.45rem;
+        background: #fff;
+        box-shadow: 0 1.25rem 3rem rgba(31, 27, 23, 0.24);
+      }
+      .command-dialog-header {
+        display: grid;
+        gap: 0.3rem;
+        padding: 0.85rem 1rem 0.7rem;
+        border-bottom: 1px solid #ece8df;
+      }
+      .command-dialog-header h2 {
+        margin: 0;
+        font-size: 1rem;
+        line-height: 1.15;
+      }
+      .command-dialog-command {
+        margin: 0;
+        color: var(--muted);
+        font-family: "SFMono-Regular", "Cascadia Code", monospace;
+        font-size: 0.78rem;
+        overflow-wrap: anywhere;
+      }
+      .command-dialog-output {
+        min-height: 0;
+        margin: 0;
+        padding: 0.85rem 1rem;
+        overflow: auto;
+        white-space: pre-wrap;
+        background: #181614;
+        color: #f8efe4;
+        font-size: 0.76rem;
+        line-height: 1.45;
+      }
+      .command-dialog-actions {
+        display: flex;
+        justify-content: flex-end;
+        gap: 0.35rem;
+        padding: 0.65rem 0.75rem;
+        border-top: 1px solid #ece8df;
+        background: #fff;
+      }
       .toolbar-meta {
         color: var(--muted);
         display: flex;
@@ -358,6 +416,11 @@
         min-height: 0;
         overflow: auto;
       }
+      .detail:focus {
+        outline: none;
+        border-color: var(--focus);
+        box-shadow: 0 0 0 1px var(--focus);
+      }
       .detail-hero,
       .panel-heading {
         display: flex;
@@ -366,6 +429,16 @@
         align-items: start;
         flex-wrap: wrap;
       }
+      .detail-hero {
+        position: sticky;
+        top: -0.62rem;
+        z-index: 2;
+        margin: -0.62rem -0.8rem 0 -0.5rem;
+        padding: 0.62rem 0.8rem 0.5rem 0.5rem;
+        border-bottom: 1px solid #f0ede6;
+        background: rgba(255, 255, 255, 0.96);
+        backdrop-filter: blur(0.45rem);
+      }
       .detail-hero-copy {
         display: grid;
         gap: 0.2rem;
@@ -384,6 +457,16 @@
         min-width: 0;
         flex: 1 1 auto;
       }
+      .detail-heading {
+        display: flex;
+        align-items: center;
+        flex-wrap: wrap;
+        gap: 0.5rem;
+        min-width: 0;
+      }
+      .detail-hero-copy .detail-heading h2 {
+        flex: 0 1 auto;
+      }
       .detail-hero-copy h2 {
         margin: 0;
         font-size: 2.35rem;
@@ -396,6 +479,32 @@
         font-weight: 600;
         color: var(--muted);
       }
+      .detail-package-type {
+        display: inline-flex;
+        align-items: center;
+        gap: 0.28rem;
+        flex: 0 0 auto;
+        border: 1px solid var(--line);
+        border-radius: 999px;
+        background: #faf8f3;
+        color: var(--muted);
+        padding: 0.16rem 0.42rem 0.16rem 0.3rem;
+        font-size: 0.68rem;
+        font-weight: 700;
+        line-height: 1;
+        letter-spacing: 0.01em;
+      }
+      .detail-package-type-icon {
+        display: inline-flex;
+        width: 0.9rem;
+        height: 0.9rem;
+        color: var(--ink);
+      }
+      .detail-package-type-icon svg {
+        display: block;
+        width: 100%;
+        height: 100%;
+      }
       .detail-title-row .link-strip {
         margin-left: auto;
         align-self: start;
@@ -528,9 +637,18 @@
         overflow: hidden;
       }
       .revision-future {
-        border-style: dashed;
-        border-color: rgba(124, 124, 133, 0.55);
-        background: linear-gradient(180deg, rgba(124, 124, 133, 0.07), rgba(255,255,255,0.45));
+        position: relative;
+        border: 2px solid rgba(37, 99, 201, 0.3);
+        background:
+          repeating-linear-gradient(
+            135deg,
+            rgba(37, 99, 201, 0.018) 0,
+            rgba(37, 99, 201, 0.018) 0.5rem,
+            rgba(255, 255, 255, 0) 0.5rem,
+            rgba(255, 255, 255, 0) 1.2rem
+          ),
+          #fbfdff;
+        box-shadow: inset 0.24rem 0 0 rgba(37, 99, 201, 0.42);
       }
       .revision-current {
         border-color: rgba(47, 143, 91, 0.25);
@@ -563,7 +681,8 @@
         background: rgba(124, 124, 133, 0.09);
       }
       .revision-future .revision-card-titlebar {
-        background: rgba(124, 124, 133, 0.07);
+        background: rgba(37, 99, 201, 0.07);
+        border-bottom-color: rgba(37, 99, 201, 0.14);
       }
       .revision-card-actions {
         display: inline-flex;
@@ -643,4 +762,12 @@
         .detail {
           overflow: visible;
         }
+        .detail-hero {
+          position: static;
+          margin: 0;
+          padding: 0;
+          border-bottom: 0;
+          background: transparent;
+          backdrop-filter: none;
+        }
       }

data/lib/gemstar/web/templates/app.js.erb

@@ -2,6 +2,7 @@
   const projectSelect = document.querySelector("[data-project-select]");
   const fromSelect = document.querySelector("[data-from-select]");
   const toSelect = document.querySelector("[data-to-select]");
+  const projectActionButtons = Array.from(document.querySelectorAll("[data-project-action]"));
   const sidebarPanel = document.querySelector("[data-sidebar-panel]");
   const filterButtons = Array.from(document.querySelectorAll("[data-filter-button]"));
   const ecosystemButtons = Array.from(document.querySelectorAll("[data-ecosystem-button]"));
@@ -34,7 +35,9 @@
     });
   };
   const packageNameParam = (url) => url.searchParams.get("package") || url.searchParams.get("gem");
+  const packageIdParam = (url) => url.searchParams.get("package_id");
   const requestedGemName = () => packageNameParam(new URL(window.location.href));
+  const requestedPackageId = () => packageIdParam(new URL(window.location.href));
   const currentDetailGemName = () => {
     if (!detailPanel || !detailPanel.dataset.detailUrl) return null;
 
@@ -44,6 +47,15 @@
       return null;
     }
   };
+  const currentDetailPackageId = () => {
+    if (!detailPanel || !detailPanel.dataset.detailUrl) return null;
+
+    try {
+      return packageIdParam(new URL(detailPanel.dataset.detailUrl, window.location.origin));
+    } catch (_error) {
+      return null;
+    }
+  };
   const detailNeedsInitialFetch = () => detailPanel && detailPanel.dataset.detailDeferred === "true" && !!detailPanel.dataset.detailUrl;
   const isSidebarFocused = () => document.activeElement === sidebarPanel;
   const isDetailFocused = () => detailPanel && document.activeElement === detailPanel;
@@ -53,6 +65,73 @@
   const focusDetail = () => {
     if (detailPanel) detailPanel.focus({ preventScroll: true });
   };
+  const closeCommandErrorDialog = () => {
+    const overlay = document.querySelector("[data-command-error-dialog]");
+    if (overlay) overlay.remove();
+  };
+  const showCommandErrorDialog = (command, output) => {
+    closeCommandErrorDialog();
+
+    const overlay = document.createElement("div");
+    overlay.className = "command-dialog-backdrop";
+    overlay.dataset.commandErrorDialog = "true";
+
+    const dialog = document.createElement("section");
+    dialog.className = "command-dialog";
+    dialog.setAttribute("role", "alertdialog");
+    dialog.setAttribute("aria-modal", "true");
+    dialog.setAttribute("aria-labelledby", "command-dialog-title");
+
+    const header = document.createElement("header");
+    header.className = "command-dialog-header";
+
+    const title = document.createElement("h2");
+    title.id = "command-dialog-title";
+    title.textContent = "Command failed";
+
+    const commandLine = document.createElement("p");
+    commandLine.className = "command-dialog-command";
+    commandLine.textContent = command;
+
+    header.append(title, commandLine);
+
+    const outputField = document.createElement("pre");
+    outputField.className = "command-dialog-output";
+    outputField.tabIndex = 0;
+    outputField.textContent = output || "No output captured.";
+
+    const actions = document.createElement("div");
+    actions.className = "command-dialog-actions";
+
+    const copyButton = document.createElement("button");
+    copyButton.type = "button";
+    copyButton.className = "action";
+    copyButton.textContent = "Copy";
+    copyButton.addEventListener("click", () => {
+      navigator.clipboard.writeText(`Command failed: ${command}\n\n${output || ""}`)
+        .then(() => {
+          copyButton.textContent = "Copied";
+          setTimeout(() => {
+            copyButton.textContent = "Copy";
+          }, 1400);
+        })
+        .catch(() => {
+          outputField.focus();
+        });
+    });
+
+    const closeButton = document.createElement("button");
+    closeButton.type = "button";
+    closeButton.className = "action action-primary";
+    closeButton.textContent = "Close";
+    closeButton.addEventListener("click", closeCommandErrorDialog);
+
+    actions.append(copyButton, closeButton);
+    dialog.append(header, outputField, actions);
+    overlay.append(dialog);
+    document.body.append(overlay);
+    closeButton.focus({ preventScroll: true });
+  };
   const storedDetailDisclosureOpen = () => {
     try {
       return window.localStorage.getItem(detailDisclosureStorageKey) === "true";
@@ -82,6 +161,7 @@
   const applyGemFilter = (filter) => {
     currentFilter = filter;
     const pinnedGemName = requestedGemName();
+    const pinnedPackageId = requestedPackageId();
     const searchTerm = currentSearch.trim().toLowerCase();
 
     filterButtons.forEach((button) => {
@@ -94,7 +174,7 @@
 
     gemLinks.forEach((link) => {
       const updated = link.dataset.gemUpdated === "true";
-      const pinned = pinnedGemName && link.dataset.gemName === pinnedGemName;
+      const pinned = pinnedPackageId ? link.dataset.packageId === pinnedPackageId : pinnedGemName && link.dataset.gemName === pinnedGemName;
       const matchesScope = currentPackageScope === "all" || link.dataset.packageScope === currentPackageScope;
       const matchesSearch = searchTerm === "" || link.dataset.gemName.toLowerCase().includes(searchTerm);
       link.hidden = (!matchesScope || (filter === "updated" && !updated && !pinned) || !matchesSearch);
@@ -115,16 +195,34 @@
     }
   };
 
-  const syncSidebarSelection = (gemName = null, keepVisible = false) => {
+  const keepSidebarLinkVisible = (link) => {
+    if (!sidebarPanel || !link) return;
+
+    const panelBounds = sidebarPanel.getBoundingClientRect();
+    const stickyHeader = sidebarPanel.querySelector(".sidebar-header");
+    const headerBounds = stickyHeader && stickyHeader.getBoundingClientRect();
+    const linkBounds = link.getBoundingClientRect();
+    const visibleTop = headerBounds ? Math.max(panelBounds.top, headerBounds.bottom) : panelBounds.top;
+
+    if (linkBounds.top < visibleTop) {
+      sidebarPanel.scrollTop -= visibleTop - linkBounds.top;
+    } else if (linkBounds.bottom > panelBounds.bottom) {
+      sidebarPanel.scrollTop += linkBounds.bottom - panelBounds.bottom;
+    }
+  };
+
+  const syncSidebarSelection = (packageId = null, gemName = null, keepVisible = false) => {
+    const effectivePackageId = packageId || requestedPackageId();
     const effectiveGemName = gemName || requestedGemName();
-    if (!effectiveGemName) {
+    if (!effectivePackageId && !effectiveGemName) {
       clearSidebarSelection();
       return;
     }
 
     let selectedLink = null;
     gemLinks.forEach((link) => {
-      const matches = link.dataset.gemName === effectiveGemName;
+      const identityMatches = effectivePackageId ? link.dataset.packageId === effectivePackageId : link.dataset.gemName === effectiveGemName;
+      const matches = !link.hidden && identityMatches;
       link.classList.toggle("is-selected", matches);
       if (matches) {
         selectedLink = link;
@@ -132,7 +230,7 @@
     });
 
     if (keepVisible && sidebarPanel && selectedLink) {
-      selectedLink.scrollIntoView({ block: "nearest" });
+      keepSidebarLinkVisible(selectedLink);
     }
   };
 
@@ -211,7 +309,7 @@
           window.history[historyMethod]({}, "", pageUrl);
         }
         const detailUrl = new URL(url, window.location.origin);
-        syncSidebarSelection(packageNameParam(detailUrl));
+        syncSidebarSelection(packageIdParam(detailUrl), packageNameParam(detailUrl));
       })
       .catch(() => {
         stopDetailLoading();
@@ -223,7 +321,7 @@
 
     stopDetailPoll();
     stopDetailLoading();
-    syncSidebarSelection(link.dataset.gemName, keepVisible);
+    syncSidebarSelection(link.dataset.packageId, link.dataset.gemName, keepVisible);
     fetchDetail(link.dataset.detailUrl || link.href, historyMode);
 
     focusSidebar();
@@ -231,13 +329,17 @@
 
   const ensureInitialGemSelection = () => {
     const requested = requestedGemName();
+    const requestedId = requestedPackageId();
 
     const detailGemName = currentDetailGemName();
-    const detailLink = detailGemName ? visibleGemLinks().find((link) => link.dataset.gemName === detailGemName) : null;
+    const detailPackageId = currentDetailPackageId();
+    const detailLink = detailPackageId ?
+      visibleGemLinks().find((link) => link.dataset.packageId === detailPackageId) :
+      (detailGemName ? visibleGemLinks().find((link) => link.dataset.gemName === detailGemName) : null);
 
     if (detailLink) {
-      syncSidebarSelection(detailGemName, true);
-      if (!requested) {
+      syncSidebarSelection(detailLink.dataset.packageId, detailLink.dataset.gemName, true);
+      if (!requested && !requestedId) {
         const pageUrl = new URL(window.location.href);
         const detailUrl = new URL(detailLink.dataset.detailUrl || detailLink.href, window.location.origin);
         pageUrl.search = detailUrl.search;
@@ -246,19 +348,19 @@
         window.history.replaceState({}, "", pageUrl);
       }
       if (detailNeedsInitialFetch()) {
-        fetchDetail(detailLink.dataset.detailUrl || detailLink.href, requested ? "none" : "replace", { refresh: pendingManualDetailRefresh });
+        fetchDetail(detailLink.dataset.detailUrl || detailLink.href, requested || requestedId ? "none" : "replace", { refresh: pendingManualDetailRefresh });
         pendingManualDetailRefresh = false;
       }
       return;
     }
 
-    if (requested) return;
+    if (requested || requestedId) return;
 
     const firstVisibleLink = visibleGemLinks()[0];
     if (firstVisibleLink) {
       const refresh = pendingManualDetailRefresh;
       pendingManualDetailRefresh = false;
-      syncSidebarSelection(firstVisibleLink.dataset.gemName, true);
+      syncSidebarSelection(firstVisibleLink.dataset.packageId, firstVisibleLink.dataset.gemName, true);
       fetchDetail(firstVisibleLink.dataset.detailUrl || firstVisibleLink.href, "replace", { refresh });
       focusSidebar();
     }
@@ -279,7 +381,7 @@
     scheduleDetailPoll();
   }
 
-  syncSidebarSelection(null, true);
+  syncSidebarSelection(null, null, true);
   applyGemFilter(currentFilter);
   ensureInitialGemSelection();
 
@@ -299,7 +401,7 @@
       const url = new URL(window.location.href);
       url.searchParams.set("filter", currentFilter);
       window.history.replaceState({}, "", url);
-      syncSidebarSelection(null, true);
+      syncSidebarSelection(null, null, true);
     });
   });
 
@@ -313,7 +415,7 @@
       const url = new URL(window.location.href);
       url.searchParams.set("scope", currentPackageScope);
       window.history.replaceState({}, "", url);
-      syncSidebarSelection(null, true);
+      syncSidebarSelection(null, null, true);
     });
   });
 
@@ -324,7 +426,7 @@
       if (sidebarPanel) {
         sidebarPanel.scrollTop = 0;
       }
-      syncSidebarSelection(null, true);
+      syncSidebarSelection(null, null, true);
     });
   }
 
@@ -338,6 +440,55 @@
     fetchDetail(detailPanel.dataset.detailUrl, "none", { refresh: true, useGh: true });
   });
 
+  projectActionButtons.forEach((button) => {
+    button.addEventListener("click", () => {
+      const actionId = button.dataset.projectAction;
+      const command = button.dataset.projectActionCommand || actionId;
+      if (!actionId) return;
+      if (!window.confirm(`Run ${command}?`)) return;
+
+      const originalText = button.textContent;
+      projectActionButtons.forEach((actionButton) => {
+        actionButton.disabled = true;
+      });
+      button.textContent = "Running...";
+
+      const params = new URLSearchParams();
+      params.set("project", "<%= selected_project_index %>");
+
+      fetch(`/actions/${encodeURIComponent(actionId)}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+          "X-Requested-With": "gemstar-action"
+        },
+        body: params.toString()
+      })
+        .then((response) => response.json().then((payload) => ({ response, payload })))
+        .then(({ response, payload }) => {
+          if (!response.ok || !payload.ok) {
+            const output = payload && payload.output ? payload.output : "";
+            const failedCommand = payload && payload.command ? payload.command : command;
+            showCommandErrorDialog(failedCommand, output);
+            button.textContent = originalText;
+            projectActionButtons.forEach((actionButton) => {
+              actionButton.disabled = false;
+            });
+            return;
+          }
+
+          window.location.reload();
+        })
+        .catch((error) => {
+          showCommandErrorDialog(command, error.message);
+          button.textContent = originalText;
+          projectActionButtons.forEach((actionButton) => {
+            actionButton.disabled = false;
+          });
+        });
+    });
+  });
+
   const navigate = (params) => {
     const url = new URL(window.location.href);
     Object.entries(params).forEach(([key, value]) => {
@@ -357,23 +508,29 @@
         event.target.value = "<%= selected_project_index %>";
         return;
       }
-      navigate({ project: event.target.value, from: null, to: "worktree", filter: currentFilter, scope: currentPackageScope, package: null, gem: null });
+      navigate({ project: event.target.value, from: null, to: "worktree", filter: currentFilter, scope: currentPackageScope, package: null, package_id: null, gem: null });
     });
   }
 
   if (fromSelect) {
     fromSelect.addEventListener("change", (event) => {
-      navigate({ from: event.target.value, filter: currentFilter, scope: currentPackageScope, package: null, gem: null });
+      navigate({ from: event.target.value, filter: currentFilter, scope: currentPackageScope, package: null, package_id: null, gem: null });
     });
   }
 
   if (toSelect) {
     toSelect.addEventListener("change", (event) => {
-      navigate({ to: event.target.value, filter: currentFilter, scope: currentPackageScope, package: null, gem: null });
+      navigate({ to: event.target.value, filter: currentFilter, scope: currentPackageScope, package: null, package_id: null, gem: null });
     });
   }
 
   document.addEventListener("keydown", (event) => {
+    if (event.key === "Escape" && document.querySelector("[data-command-error-dialog]")) {
+      event.preventDefault();
+      closeCommandErrorDialog();
+      return;
+    }
+
     const tagName = document.activeElement && document.activeElement.tagName;
     if (tagName === "INPUT" || tagName === "TEXTAREA" || tagName === "SELECT") return;
 
@@ -421,7 +578,7 @@
     if (!links.length) return;
 
     const selectedGem = currentSelectedIndex();
-    const currentIndex = selectedGem >= 0 ? selectedGem : 0;
+    const currentIndex = selectedGem >= 0 ? selectedGem : (event.key === "ArrowUp" ? links.length : -1);
     let nextIndex = null;
 
     if (event.key === "ArrowDown") nextIndex = Math.min(currentIndex + 1, links.length - 1);

data/lib/gemstar.rb

@@ -9,6 +9,8 @@ require "gemstar/commands/cache"
 require "gemstar/commands/diff"
 require "gemstar/commands/server"
 require "gemstar/config"
+require "gemstar/cargo_lock_file"
+require "gemstar/crates_io_metadata"
 require "gemstar/outputs/basic"
 require "gemstar/outputs/html"
 require "gemstar/outputs/markdown"
@@ -19,8 +21,10 @@ require "gemstar/importmap_file"
 require "gemstar/lock_file"
 require "gemstar/npm_metadata"
 require "gemstar/package_lock_file"
+require "gemstar/pypi_metadata"
 require "gemstar/project"
 require "gemstar/remote_repository"
 require "gemstar/utils"
 require "gemstar/ruby_gems_metadata"
+require "gemstar/uv_lock_file"
 require "gemstar/git_repo"

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: gemstar
 version: !ruby/object:Gem::Version
-  version: '1.2'
+  version: '1.3'
 platform: ruby
 authors:
 - Florian Dejako
@@ -219,8 +219,8 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: '1.9'
-description: Gem changelog viewer and more, but starting as a changelog viewer for
-  bundled gems.
+description: Browse and compare changelogs for Ruby gems, JavaScript packages, Python
+  packages, and Rust crates in your projects.
 email:
 - fdejako@gmail.com
 executables:
@@ -236,6 +236,7 @@ files:
 - lib/gemstar/cache.rb
 - lib/gemstar/cache_cli.rb
 - lib/gemstar/cache_warmer.rb
+- lib/gemstar/cargo_lock_file.rb
 - lib/gemstar/change_log.rb
 - lib/gemstar/cli.rb
 - lib/gemstar/commands/cache.rb
@@ -243,6 +244,7 @@ files:
 - lib/gemstar/commands/diff.rb
 - lib/gemstar/commands/server.rb
 - lib/gemstar/config.rb
+- lib/gemstar/crates_io_metadata.rb
 - lib/gemstar/data/importmap_package_metadata.json
 - lib/gemstar/data/ruby_gems_metadata.json
 - lib/gemstar/git_hub.rb
@@ -255,10 +257,12 @@ files:
 - lib/gemstar/outputs/markdown.rb
 - lib/gemstar/package_lock_file.rb
 - lib/gemstar/project.rb
+- lib/gemstar/pypi_metadata.rb
 - lib/gemstar/remote_repository.rb
 - lib/gemstar/request_logger.rb
 - lib/gemstar/ruby_gems_metadata.rb
 - lib/gemstar/utils.rb
+- lib/gemstar/uv_lock_file.rb
 - lib/gemstar/version.rb
 - lib/gemstar/web/app.rb
 - lib/gemstar/web/templates/app.css
@@ -288,5 +292,5 @@ required_rubygems_version: !ruby/object:Gem::Requirement
 requirements: []
 rubygems_version: 3.6.9
 specification_version: 4
-summary: Making sense of gems.
+summary: Changelog viewer for Ruby, JavaScript, Python, and Rust dependencies.
 test_files: []