fix(gui): resolve TypeScript errors in Git components (#314)

- AddWorktreeDialog: Remove unused onMount import, prefix loadingBranches with _
- GitLFSManager: Remove unused createEffect, Modal imports; fix tokens.colors.surface.default to .base; fix Tabs API (use id prop, activeTab instead of value); fix ProgressBar variant
- LFSFileIndicator: Remove unused Show import; fix SimpleTooltip prop (content -> text)
- LFSTrackDialog: Remove unused onMount import
- TagManager: Wrap Icon with span for title attribute
- WorktreeManager: Remove unused gitBranches, GitBranch, getProjectPath, ListItem imports; fix typography.fontFamily.code to .mono; wrap Text with span for title; prefix _getParentPath; wrap Icon with span for title

These changes address TS2322, TS2339, and TS6133 errors in the Git-related UI components.

Co-authored-by: Droid Agent <droid@factory.ai>

Author: echobt

cortex-gui/src/components/git/AddWorktreeDialog.tsx

@@ -8,7 +8,7 @@
  * - Remote branch tracking
  */
 
-import { createSignal, Show, For, createEffect, onMount } from "solid-js";
+import { createSignal, Show, For, createEffect } from "solid-js";
 import { Icon } from "../ui/Icon";
 import {
   gitBranches,
@@ -54,7 +54,7 @@ export function AddWorktreeDialog(props: AddWorktreeDialogProps) {
   // UI state
   const [branches, setBranches] = createSignal<GitBranch[]>([]);
   const [branchSearch, setBranchSearch] = createSignal("");
-  const [loadingBranches, setLoadingBranches] = createSignal(false);
+  const [_loadingBranches, setLoadingBranches] = createSignal(false);
   const [showBranchList, setShowBranchList] = createSignal(false);
 
   // Validation state

cortex-gui/src/components/git/GitLFSManager.tsx

@@ -9,7 +9,7 @@
  * - File locking support
  */
 
-import { createSignal, createEffect, For, Show, createMemo, onMount, onCleanup } from "solid-js";
+import { createSignal, For, Show, createMemo, onMount, onCleanup } from "solid-js";
 import { Icon } from "../ui/Icon";
 import { invoke } from "@tauri-apps/api/core";
 import {
@@ -19,7 +19,6 @@ import {
   Badge,
   Text,
   ListItem,
-  Modal,
   ProgressBar,
   EmptyState,
   Tabs,
@@ -159,7 +158,8 @@ async function unlockFile(repoPath: string, filePath: string, force: boolean = f
   return invoke("git_lfs_unlock", { path: repoPath, filePath, force });
 }
 
-async function getLFSLocks(repoPath: string): Promise<LFSLock[]> {
+// Prepared for locks feature (future use)
+async function _getLFSLocks(repoPath: string): Promise<LFSLock[]> {
   return invoke("git_lfs_locks", { path: repoPath });
 }
 
@@ -610,7 +610,7 @@ export function GitLFSManager(props: GitLFSManagerProps) {
         display: "flex",
         "flex-direction": "column",
         height: "100%",
-        background: tokens.colors.surface.default,
+        background: tokens.colors.surface.base,
       }}
     >
       {/* Header */}
@@ -698,7 +698,7 @@ export function GitLFSManager(props: GitLFSManagerProps) {
           <Show when={storagePercentage() !== null}>
             <ProgressBar
               value={storagePercentage()!}
-              variant={storagePercentage()! > 90 ? "error" : storagePercentage()! > 75 ? "warning" : "default"}
+              variant={storagePercentage()! > 90 ? "error" : storagePercentage()! > 75 ? "primary" : "default"}
               size="sm"
             />
           </Show>
@@ -759,35 +759,35 @@ export function GitLFSManager(props: GitLFSManagerProps) {
       </div>
 
       {/* Tabs */}
-      <Tabs value={activeTab()} onChange={setActiveTab}>
+      <Tabs activeTab={activeTab()} onChange={setActiveTab}>
         <TabList>
-          <Tab value="files">
+          <Tab id="files">
             Files
             <Show when={pointerFileCount() > 0}>
               <Badge variant="warning" size="sm" style={{ "margin-left": "6px" }}>
                 {pointerFileCount()}
               </Badge>
             </Show>
           </Tab>
-          <Tab value="patterns">
+          <Tab id="patterns">
             Patterns
             <Badge variant="default" size="sm" style={{ "margin-left": "6px" }}>
               {status()?.trackedPatterns.length || 0}
             </Badge>
           </Tab>
-          <Tab value="locks">
+          <Tab id="locks">
             Locks
             <Show when={(status()?.locks.length || 0) > 0}>
               <Badge variant="warning" size="sm" style={{ "margin-left": "6px" }}>
                 {status()?.locks.length}
               </Badge>
             </Show>
           </Tab>
-          <Tab value="storage">Storage</Tab>
+          <Tab id="storage">Storage</Tab>
         </TabList>
 
         {/* Files Tab */}
-        <TabPanel value="files">
+        <TabPanel id="files">
           <div style={{ height: "100%", "overflow-y": "auto" }}>
             {/* Search */}
             <div style={{ padding: "8px 16px" }}>
@@ -897,7 +897,7 @@ export function GitLFSManager(props: GitLFSManagerProps) {
         </TabPanel>
 
         {/* Patterns Tab */}
-        <TabPanel value="patterns">
+        <TabPanel id="patterns">
           <div style={{ height: "100%", "overflow-y": "auto" }}>
             <Show
               when={(status()?.trackedPatterns.length || 0) > 0}
@@ -949,7 +949,7 @@ export function GitLFSManager(props: GitLFSManagerProps) {
         </TabPanel>
 
         {/* Locks Tab */}
-        <TabPanel value="locks">
+        <TabPanel id="locks">
           <div style={{ height: "100%", "overflow-y": "auto" }}>
             <Show
               when={(status()?.locks.length || 0) > 0}
@@ -1002,7 +1002,7 @@ export function GitLFSManager(props: GitLFSManagerProps) {
         </TabPanel>
 
         {/* Storage Tab */}
-        <TabPanel value="storage">
+        <TabPanel id="storage">
           <div style={{ padding: "16px" }}>
             <Show
               when={status()?.storage}

cortex-gui/src/components/git/LFSFileIndicator.tsx

@@ -8,7 +8,7 @@
  * - Lock icon: File is locked
  */
 
-import { createSignal, createEffect, Show, createMemo } from "solid-js";
+import { createSignal, createEffect, createMemo } from "solid-js";
 import { Icon } from '../ui/Icon';
 import { invoke } from "@tauri-apps/api/core";
 import { SimpleTooltip } from "@/components/ui";
@@ -267,7 +267,7 @@ export function LFSFileIndicator(props: LFSFileIndicatorProps) {
   // Wrap with tooltip if enabled
   if (props.showTooltip !== false && status() !== "not-tracked") {
     return (
-      <SimpleTooltip content={getTooltipText()}>
+      <SimpleTooltip text={getTooltipText()}>
         {indicator}
       </SimpleTooltip>
     );
@@ -338,7 +338,7 @@ export function LFSDirectoryIndicator(props: LFSDirectoryIndicatorProps) {
   // Show warning if there are pointer files
   if (s.pointerFiles > 0) {
     return (
-      <SimpleTooltip content={`${s.pointerFiles} LFS files not fetched`}>
+      <SimpleTooltip text={`${s.pointerFiles} LFS files not fetched`}>
         <span style={{ display: "inline-flex", "align-items": "center" }}>
           <Icon
             name="download"
@@ -356,7 +356,7 @@ export function LFSDirectoryIndicator(props: LFSDirectoryIndicatorProps) {
   // Show lock icon if there are locked files
   if (s.lockedFiles > 0) {
     return (
-      <SimpleTooltip content={`${s.lockedFiles} locked files`}>
+      <SimpleTooltip text={`${s.lockedFiles} locked files`}>
         <span style={{ display: "inline-flex", "align-items": "center" }}>
           <Icon
             name="lock"
@@ -373,7 +373,7 @@ export function LFSDirectoryIndicator(props: LFSDirectoryIndicatorProps) {
 
   // Show cloud icon for fully synced LFS directory
   return (
-    <SimpleTooltip content={`${s.totalFiles} LFS files`}>
+    <SimpleTooltip text={`${s.totalFiles} LFS files`}>
       <span style={{ display: "inline-flex", "align-items": "center" }}>
         <Icon
           name="cloud"

cortex-gui/src/components/git/LFSTrackDialog.tsx

@@ -8,7 +8,7 @@
  * - Common patterns quick-select
  */
 
-import { createSignal, createEffect, For, Show, createMemo, onMount } from "solid-js";
+import { createSignal, createEffect, For, Show, createMemo } from "solid-js";
 import { Icon } from '../ui/Icon';
 import { invoke } from "@tauri-apps/api/core";
 import {

cortex-gui/src/components/git/TagManager.tsx

@@ -340,10 +340,14 @@ export function TagManager(props: TagManagerProps) {
               </span>
             </Show>
             <Show when={tag().isPushed}>
-              <Icon name="cloud" style={{ width: "12px", height: "12px", color: tokens.colors.semantic.success }} title="Pushed to remote" />
+              <span title="Pushed to remote">
+                <Icon name="cloud" style={{ width: "12px", height: "12px", color: tokens.colors.semantic.success }} />
+              </span>
             </Show>
             <Show when={!tag().isPushed}>
-              <Icon name="cloud-slash" style={{ width: "12px", height: "12px", color: tokens.colors.text.muted }} title="Local only" />
+              <span title="Local only">
+                <Icon name="cloud-slash" style={{ width: "12px", height: "12px", color: tokens.colors.text.muted }} />
+              </span>
             </Show>
           </div>
         }

cortex-gui/src/components/git/WorktreeManager.tsx

@@ -18,18 +18,14 @@ import {
   gitWorktreeRepair,
   gitWorktreePrune,
   gitStatus,
-  gitBranches,
   type GitWorktree,
-  type GitBranch,
 } from "../../utils/tauri-api";
-import { getProjectPath } from "../../utils/workspace";
 import {
   Button,
   IconButton,
   Input,
   Badge,
   Text,
-  ListItem,
   Modal,
 } from "@/components/ui";
 import { tokens } from "@/design-system/tokens";
@@ -244,7 +240,8 @@ export function WorktreeManager(props: WorktreeManagerProps) {
     return parts[parts.length - 1];
   };
 
-  const getParentPath = (path: string): string => {
+  // Helper for potential future use (e.g., path navigation)
+  const _getParentPath = (path: string): string => {
     const parts = path.split(/[/\\]/);
     if (parts.length <= 1) return "";
     return parts.slice(0, -1).join("/");
@@ -498,7 +495,9 @@ export function WorktreeManager(props: WorktreeManagerProps) {
                           </Show>
 
                           <Show when={worktree.isLocked}>
-                            <Icon name="lock" size={12} style={{ color: tokens.colors.semantic.warning }} title="Locked" />
+                            <span title="Locked">
+                              <Icon name="lock" size={12} style={{ color: tokens.colors.semantic.warning }} />
+                            </span>
                           </Show>
 
                           <Show when={isDirty()}>
@@ -529,25 +528,26 @@ export function WorktreeManager(props: WorktreeManagerProps) {
                               detached HEAD
                             </Text>
                           </Show>
-                          <Text style={{ "font-size": "10px", "font-family": tokens.typography.fontFamily.code, color: tokens.colors.text.muted }}>
+                          <Text style={{ "font-size": "10px", "font-family": tokens.typography.fontFamily.mono, color: tokens.colors.text.muted }}>
                             {worktree.commit.substring(0, 7)}
                           </Text>
                         </div>
 
                         {/* Path */}
-                        <Text
-                          style={{
-                            "font-size": "10px",
-                            color: tokens.colors.text.muted,
-                            overflow: "hidden",
-                            "text-overflow": "ellipsis",
-                            "white-space": "nowrap",
-                            "margin-top": "2px",
-                          }}
-                          title={worktree.path}
-                        >
-                          {worktree.path}
-                        </Text>
+                        <span title={worktree.path}>
+                          <Text
+                            style={{
+                              "font-size": "10px",
+                              color: tokens.colors.text.muted,
+                              overflow: "hidden",
+                              "text-overflow": "ellipsis",
+                              "white-space": "nowrap",
+                              "margin-top": "2px",
+                            }}
+                          >
+                            {worktree.path}
+                          </Text>
+                        </span>
                       </div>
 
                       {/* Quick actions */}
@@ -625,7 +625,7 @@ export function WorktreeManager(props: WorktreeManagerProps) {
                             <Text style={{ "font-size": "10px", "font-weight": "600", "text-transform": "uppercase", "letter-spacing": "0.5px", color: tokens.colors.text.muted, "margin-bottom": tokens.spacing.xs }}>
                               Path
                             </Text>
-                            <Text style={{ "font-size": "11px", "font-family": tokens.typography.fontFamily.code, color: tokens.colors.text.primary, "word-break": "break-all" }}>
+                            <Text style={{ "font-size": "11px", "font-family": tokens.typography.fontFamily.mono, color: tokens.colors.text.primary, "word-break": "break-all" }}>
                               {worktree.path}
                             </Text>
                           </div>
@@ -645,7 +645,7 @@ export function WorktreeManager(props: WorktreeManagerProps) {
                             <Text style={{ "font-size": "10px", "font-weight": "600", "text-transform": "uppercase", "letter-spacing": "0.5px", color: tokens.colors.text.muted, "margin-bottom": tokens.spacing.xs }}>
                               HEAD Commit
                             </Text>
-                            <Text style={{ "font-size": "11px", "font-family": tokens.typography.fontFamily.code, color: tokens.colors.text.primary }}>
+                            <Text style={{ "font-size": "11px", "font-family": tokens.typography.fontFamily.mono, color: tokens.colors.text.primary }}>
                               {worktree.commit}
                             </Text>
                           </div>
@@ -794,7 +794,7 @@ export function WorktreeManager(props: WorktreeManagerProps) {
               <Text style={{ "font-size": "12px", "font-weight": "500", color: tokens.colors.text.primary }}>
                 {getWorktreeName(confirmRemove()!.path)}
               </Text>
-              <Text style={{ "font-size": "11px", "font-family": tokens.typography.fontFamily.code, color: tokens.colors.text.muted, "margin-top": tokens.spacing.xs }}>
+              <Text style={{ "font-size": "11px", "font-family": tokens.typography.fontFamily.mono, color: tokens.colors.text.muted, "margin-top": tokens.spacing.xs }}>
                 {confirmRemove()!.path}
               </Text>
             </div>
@@ -857,7 +857,7 @@ export function WorktreeManager(props: WorktreeManagerProps) {
               <Text style={{ "font-size": "12px", "font-weight": "500", color: tokens.colors.text.muted, "margin-bottom": tokens.spacing.sm }}>
                 Current Location
               </Text>
-              <Text style={{ "font-size": "12px", "font-family": tokens.typography.fontFamily.code, color: tokens.colors.text.primary }}>
+              <Text style={{ "font-size": "12px", "font-family": tokens.typography.fontFamily.mono, color: tokens.colors.text.primary }}>
                 {showMoveDialog()!.path}
               </Text>
             </div>