refactor(explorer): update context menu for file history

src/lib/components/ExplorerPanel.svelte

@@ -11,6 +11,7 @@
     FileCog,
     FileImage,
     FileJson,
+    FileSearch,
     FileSpreadsheet,
     FileText,
     FileType,
@@ -37,6 +38,7 @@
     onCollapseAllFolders: () => void;
     onSelectNode: (node: ExplorerNode) => void;
     onOpenFile: (node: ExplorerNode) => void;
+    onFileHistory: (node: ExplorerNode) => void;
     onBlame: (node: ExplorerNode) => void;
     collapsed?: boolean;
     onToggleCollapsed?: () => void;
@@ -54,6 +56,7 @@
     onCollapseAllFolders = () => {},
     onSelectNode = () => {},
     onOpenFile = () => {},
+    onFileHistory = () => {},
     onBlame = () => {},
     collapsed = false,
     onToggleCollapsed = () => {},
@@ -175,7 +178,7 @@
 
     contextNode = node;
     contextMenuX = Math.max(8, Math.min(event.clientX + 2, window.innerWidth - 192));
-    contextMenuY = Math.max(8, Math.min(event.clientY + 2, window.innerHeight - 56));
+    contextMenuY = Math.max(8, Math.min(event.clientY + 2, window.innerHeight - 132));
   }
 
   function closeFileContextMenu() {
@@ -196,6 +199,13 @@
     onBlame(node);
   }
 
+  function openContextFileHistory() {
+    const node = contextNode;
+    if (!node || node.kind !== "file" || !node.tracked) return;
+    closeFileContextMenu();
+    onFileHistory(node);
+  }
+
   function handleWindowKeydown(event: KeyboardEvent) {
     if (event.key === "Escape") closeFileContextMenu();
   }
@@ -261,12 +271,14 @@
   {:else}
     <div class="explorer-list overflow-auto p-2">
       {#each visibleNodes as node (`${node.kind}:${node.path}`)}
+        <!-- svelte-ignore a11y_no_static_element_interactions -->
         <div
           class="explorer-row"
           class:active={selectedExplorerPath === node.path && selectedExplorerKind === node.kind}
           class:folder={node.kind === "folder"}
           style={`--depth: ${node.depth}`}
           title={node.path}
+          oncontextmenu={(event) => openFileContextMenu(event, node)}
         >
           {#if node.kind === "folder"}
             <button
@@ -328,9 +340,8 @@
             class="explorer-select"
             type="button"
             onclick={() => onSelectNode(node)}
-            oncontextmenu={(event) => openFileContextMenu(event, node)}
             disabled={isBusy}
-            title={`Show history for ${node.path}`}
+            title={`Select ${node.path}`}
           >
             <span>{node.name}</span>
           </button>
@@ -355,6 +366,16 @@
     tabindex="-1"
     aria-label={`Actions for ${contextNode.path}`}
   >
+    <button
+      type="button"
+      role="menuitem"
+      onclick={openContextFileHistory}
+      disabled={!contextNode.tracked}
+      title={contextNode.tracked ? "Show the commit history for this file" : "File history is only available for tracked files"}
+    >
+      <History size={14} aria-hidden="true" />
+      File history
+    </button>
     <button
       type="button"
       role="menuitem"
@@ -372,7 +393,7 @@
       disabled={!contextNode.tracked || contextNode.status === "deleted"}
       title={!contextNode.tracked || contextNode.status === "deleted" ? "Blame is only available for tracked files" : "Show blame for this file"}
     >
-      <History size={14} aria-hidden="true" />
+      <FileSearch size={14} aria-hidden="true" />
       Blame
     </button>
   </div>