feat(analytics): integrate analytics across remaining UI components

- Add slash command tracking:
  - Track command selection with method (click/keyboard/autocomplete)
  - Monitor command execution with parameters and timing
  - Record custom command creation events
- Enhance agent execution tracking:
  - Track agent lifecycle (start, progress, completion)
  - Monitor agent errors with retry context
  - Record execution duration and success metrics
- Add tab management analytics:
  - Track tab creation and closure events
  - Monitor active tab switches
- Implement timeline navigation tracking:
  - Track checkpoint navigation events
  - Monitor timeline interactions
- Update useAnalytics hook with comprehensive event helpers
- Export performance monitoring hooks from central index

This completes analytics integration across all major UI components
for full user interaction visibility.

src/components/TabContent.tsx

@@ -1,6 +1,7 @@
 import React, { Suspense, lazy, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { useTabState } from '@/hooks/useTabState';
+import { useScreenTracking } from '@/hooks/useAnalytics';
 import { Tab } from '@/contexts/TabContext';
 import { Loader2, Plus } from 'lucide-react';
 import { api, type Project, type Session, type ClaudeMdFile } from '@/lib/api';
@@ -33,6 +34,9 @@ const TabPanel: React.FC<TabPanelProps> = ({ tab, isActive }) => {
   const [selectedProject, setSelectedProject] = React.useState<Project | null>(null);
   const [sessions, setSessions] = React.useState<Session[]>([]);
   const [loading, setLoading] = React.useState(false);
+  
+  // Track screen when tab becomes active
+  useScreenTracking(isActive ? tab.type : undefined, isActive ? tab.id : undefined);
   const [error, setError] = React.useState<string | null>(null);
   
   // Load projects when tab becomes active and is of type 'projects'