diff --git a/package-lock.json b/package-lock.json
index 079647836..faf8a43a0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -59,7 +59,7 @@
       },
       "engines": {
         "node": ">=20.0.0",
-        "npm": ">=10.0.0"
+        "npm": ">=11.6.2"
       }
     },
     "node_modules/@adobe/css-tools": {
diff --git a/package.json b/package.json
index 9312341a6..060cf006e 100644
--- a/package.json
+++ b/package.json
@@ -74,7 +74,7 @@
   },
   "engines": {
     "node": ">=20.0.0",
-    "npm": ">=10.0.0"
+    "npm": ">=11.6.2"
   },
   "browserslist": {
     "production": [
diff --git a/src/components/BugReportForm.tsx b/src/components/BugReportForm.tsx
index aad2f46fd..682e9dbe2 100644
--- a/src/components/BugReportForm.tsx
+++ b/src/components/BugReportForm.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import bugReportService from '../services/bugReportService';
+import bugReportService, { IssueTemplate, TemplateField } from '../services/bugReportService';
 import githubService from '../services/githubService';
 import ScreenshotEditor from './ScreenshotEditor';
 import repositoryConfig from '../config/repositoryConfig';
@@ -9,12 +9,6 @@ interface BugReportFormProps {
   contextData?: Record<string, any>;
 }
 
-interface TemplateType {
-  name: string;
-  type: string;
-  fields: FieldDefinition[];
-}
-
 interface FieldDefinition {
   name: string;
   label: string;
@@ -29,8 +23,8 @@ interface FormDataType {
 }
 
 const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {} }) => {
-  const [templates, setTemplates] = useState<TemplateType[]>([]);
-  const [selectedTemplate, setSelectedTemplate] = useState<TemplateType | null>(null);
+  const [templates, setTemplates] = useState<IssueTemplate[]>([]);
+  const [selectedTemplate, setSelectedTemplate] = useState<IssueTemplate | null>(null);
   const [formData, setFormData] = useState<FormDataType>({});
   const [includeConsole, setIncludeConsole] = useState<boolean>(false);
   const [includeScreenshot, setIncludeScreenshot] = useState<boolean>(false);
@@ -86,14 +80,14 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
     }
   };
 
-  const handleTemplateChange = (template) => {
-    setSelectedTemplate(template);
+  const handleTemplateChange = (template: IssueTemplate | undefined) => {
+    setSelectedTemplate(template || null);
     setFormData({}); // Reset form data when template changes
-    setIncludeConsole(template.type === 'bug'); // Auto-enable console for bug reports
-    setIncludeScreenshot(template.type === 'bug'); // Auto-enable screenshot for bug reports
+    setIncludeConsole(template?.type === 'bug'); // Auto-enable console for bug reports
+    setIncludeScreenshot(template?.type === 'bug'); // Auto-enable screenshot for bug reports
   };
 
-  const handleFormChange = (fieldId, value) => {
+  const handleFormChange = (fieldId: string, value: any) => {
     setFormData(prev => ({
       ...prev,
       [fieldId]: value
@@ -118,7 +112,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
       }
     } catch (err) {
       console.error('Failed to take screenshot:', err);
-      setError('Failed to capture screenshot: ' + err.message);
+      setError('Failed to capture screenshot: ' + (err instanceof Error ? err.message : String(err)));
     } finally {
       setTakingScreenshot(false);
     }
@@ -128,7 +122,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
     setShowScreenshotEditor(true);
   };
 
-  const handleScreenshotEditorSave = (editedBlob) => {
+  const handleScreenshotEditorSave = (editedBlob: Blob) => {
     // Update the screenshot with the edited version
     setScreenshotBlob(editedBlob);
     
@@ -165,7 +159,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
     };
   }, [screenshotPreview]);
 
-  const handleSubmit = async (e) => {
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
     
     if (!selectedTemplate) {
@@ -184,7 +178,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
       const currentScreenshot = includeScreenshot ? screenshotBlob : null;
       
       // Check if user is authenticated and can submit via API
-      if (githubService.isAuthenticated) {
+      if (githubService.isAuth()) {
         const result = await bugReportService.submitIssue(
           repositoryConfig.getOwner(),
           repositoryConfig.getName(),
@@ -243,7 +237,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
       }
     } catch (err) {
       console.error('Failed to submit bug report:', err);
-      setError(err.message);
+      setError(err instanceof Error ? err.message : String(err));
     } finally {
       setSubmitting(false);
     }
@@ -266,7 +260,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
     );
   };
 
-  const renderFormField = (field) => {
+  const renderFormField = (field: TemplateField) => {
     const { id, type, attributes = {}, validations = {} } = field;
     const { label, description, placeholder, options } = attributes;
     const { required } = validations;
@@ -276,7 +270,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
         <div key={id || Math.random()} className="form-field markdown-field">
           <div 
             className="markdown-content"
-            dangerouslySetInnerHTML={{ __html: attributes.value }}
+            dangerouslySetInnerHTML={{ __html: attributes.value || '' }}
           />
         </div>
       );
@@ -342,8 +336,8 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
             >
               <option value="">Select an option...</option>
               {options?.map((option, index) => (
-                <option key={index} value={option.value || option}>
-                  {option.label || option}
+                <option key={index} value={typeof option === 'string' ? option : option.value}>
+                  {typeof option === 'string' ? option : option.label}
                 </option>
               ))}
             </select>
@@ -359,24 +353,27 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
                 {required && <span className="required">*</span>}
               </legend>
               {description && <p className="field-description">{description}</p>}
-              {options?.map((option, index) => (
-                <label key={index} className="checkbox-label">
-                  <input
-                    type="checkbox"
-                    className="checkbox-input"
-                    checked={formData[fieldId]?.includes(option.value || option) || false}
-                    onChange={(e) => {
-                      const value = option.value || option;
-                      const currentValues = formData[fieldId] || [];
-                      const newValues = e.target.checked
-                        ? [...currentValues, value]
-                        : currentValues.filter(v => v !== value);
-                      handleFormChange(fieldId, newValues);
-                    }}
-                  />
-                  {option.label || option}
-                </label>
-              ))}
+              {options?.map((option, index) => {
+                const optionValue = typeof option === 'string' ? option : option.value;
+                const optionLabel = typeof option === 'string' ? option : option.label;
+                return (
+                  <label key={index} className="checkbox-label">
+                    <input
+                      type="checkbox"
+                      className="checkbox-input"
+                      checked={formData[fieldId]?.includes(optionValue) || false}
+                      onChange={(e) => {
+                        const currentValues = formData[fieldId] || [];
+                        const newValues = e.target.checked
+                          ? [...currentValues, optionValue]
+                          : currentValues.filter((v: any) => v !== optionValue);
+                        handleFormChange(fieldId, newValues);
+                      }}
+                    />
+                    {optionLabel}
+                  </label>
+                );
+              })}
             </fieldset>
           </div>
         );
@@ -592,7 +589,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
               ) : (
                 <div className="screenshot-preview">
                   <img 
-                    src={screenshotPreview} 
+                    src={screenshotPreview || undefined} 
                     alt="Screenshot preview" 
                     className="screenshot-image"
                   />
@@ -649,7 +646,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
                 <ul>
                   <li><strong>Current Page:</strong> {contextData.pageId || 'Unknown'}</li>
                   <li><strong>URL:</strong> {window.location.href}</li>
-                  <li><strong>Authentication:</strong> {githubService.isAuthenticated ? 'Authenticated' : 'Demo Mode'}</li>
+                  <li><strong>Authentication:</strong> {githubService.isAuth() ? 'Authenticated' : 'Demo Mode'}</li>
                 </ul>
               </div>
               
@@ -691,7 +688,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
         </div>
 
         {/* Template Fields */}
-        {selectedTemplate && (
+        {selectedTemplate && Array.isArray(selectedTemplate.body) && (
           <div className="template-fields">
             {selectedTemplate.body.map(field => renderFormField(field))}
           </div>
@@ -705,7 +702,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
             disabled={submitting || !selectedTemplate}
           >
             {submitting ? 'Opening...' : 
-             githubService.isAuthenticated ? 'Submit Issue' : 'Open in GitHub'}
+             githubService.isAuth() ? 'Submit Issue' : 'Open in GitHub'}
           </button>
           
           <button
@@ -730,7 +727,7 @@ const BugReportForm: React.FC<BugReportFormProps> = ({ onClose, contextData = {}
 
         {/* Authentication Status */}
         <div className="auth-status">
-          {githubService.isAuthenticated ? (
+          {githubService.isAuth() ? (
             <p className="auth-info authenticated">
               ✅ Authenticated - Issues will be submitted directly to GitHub
             </p>
diff --git a/src/components/CollaborationModal.tsx b/src/components/CollaborationModal.tsx
index 48bfebd3f..a60700137 100644
--- a/src/components/CollaborationModal.tsx
+++ b/src/components/CollaborationModal.tsx
@@ -13,7 +13,7 @@ const CollaborationModal: React.FC<CollaborationModalProps> = ({ onClose }) => {
 
   // Handle Escape key
   useEffect(() => {
-    const handleEscape = (e) => {
+    const handleEscape = (e: KeyboardEvent) => {
       if (e.key === 'Escape') {
         onClose();
       }
@@ -143,11 +143,11 @@ const CollaborationModal: React.FC<CollaborationModalProps> = ({ onClose }) => {
     setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length);
   };
 
-  const goToSlide = (index) => {
+  const goToSlide = (index: number) => {
     setCurrentSlide(index);
   };
 
-  const handleOverlayClick = (e) => {
+  const handleOverlayClick = (e: React.MouseEvent<HTMLDivElement>) => {
     if (e.target === e.currentTarget) {
       onClose();
     }
diff --git a/src/components/ComponentEditor.tsx b/src/components/ComponentEditor.tsx
index 11a60375a..ff89d3cc3 100644
--- a/src/components/ComponentEditor.tsx
+++ b/src/components/ComponentEditor.tsx
@@ -97,12 +97,12 @@ const HealthInterventionsEditor: React.FC = () => {
       <div className="editor-content">
         <WHODigitalLibrary 
           onReferencesChange={handleReferencesChange}
-          selectedReferences={selectedReferences}
         />
       </div>
       
       <ContextualHelpMascot 
         pageId="health-interventions-editor"
+        helpContent={null}
         contextData={{ 
           profile: profile || { login: user || 'unknown' }, 
           repository: repository || { name: repo || 'unknown' }, 
@@ -174,12 +174,12 @@ const ComponentEditorContent: React.FC = () => {
           <div className="editor-content">
             <WHODigitalLibrary 
               onReferencesChange={handleReferencesChange}
-              selectedReferences={selectedReferences}
             />
           </div>
           
           <ContextualHelpMascot 
             pageId="component-editor"
+            helpContent={null}
             contextData={{ component: currentComponent }}
           />
         </div>
@@ -190,6 +190,12 @@ const ComponentEditorContent: React.FC = () => {
     }
   }
 
+  // Safety check for currentComponent
+  if (!currentComponent) {
+    navigate('/');
+    return <div>Redirecting...</div>;
+  }
+
   return (
     <div className="component-editor">
       <div className="editor-content">
diff --git a/src/components/CoreDataDictionaryViewer.tsx b/src/components/CoreDataDictionaryViewer.tsx
index 0fccd7755..b0cf41f92 100644
--- a/src/components/CoreDataDictionaryViewer.tsx
+++ b/src/components/CoreDataDictionaryViewer.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect, useCallback } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { PageLayout, usePage } from './framework';
-import { useDakComponent } from '../services/ComponentObjectProvider.tsx';
+import { useDakComponent } from '../services/ComponentObjectProvider';
 import './CoreDataDictionaryViewer.css';
 
 /**
@@ -22,7 +22,8 @@ const CoreDataDictionaryViewer = () => {
 
 const CoreDataDictionaryViewerContent = () => {
   const navigate = useNavigate();
-  const { profile, repository, branch } = usePage();
+  const pageContext = usePage() as any;
+  const { profile, repository, branch } = pageContext;
   
   // Component Object for core data elements
   const dataElementsComponent = useDakComponent('dataElements');
@@ -41,7 +42,7 @@ const CoreDataDictionaryViewerContent = () => {
 
   // Handle Escape key for modal
   useEffect(() => {
-    const handleEscape = (e) => {
+    const handleEscape = (e: KeyboardEvent) => {
       if (e.key === 'Escape' && showModal) {
         closeModal();
       }
@@ -53,7 +54,7 @@ const CoreDataDictionaryViewerContent = () => {
   }, [showModal]);
 
   // Generate base URL for IG Publisher artifacts
-  const getBaseUrl = useCallback((branchName) => {
+  const getBaseUrl = useCallback((branchName: string) => {
     const owner = user || repository?.owner?.login || repository?.full_name?.split('/')[0];
     const repoName = repo || repository?.name;
     
@@ -99,7 +100,7 @@ const CoreDataDictionaryViewerContent = () => {
       setDataElements(elements || []);
     } catch (err) {
       console.error('Error loading data elements:', err);
-      setError(err.message || 'Failed to load core data elements');
+      setError(err instanceof Error ? err.message : 'Failed to load core data elements');
     } finally {
       setLoading(false);
     }
@@ -136,7 +137,7 @@ const CoreDataDictionaryViewerContent = () => {
   };
 
   // Modal handlers
-  const openModal = (element) => {
+  const openModal = (element: any) => {
     setSelectedElement(element);
     setShowModal(true);
   };
diff --git a/src/components/DAKStatusBox.tsx b/src/components/DAKStatusBox.tsx
index be636a56a..21c74e948 100644
--- a/src/components/DAKStatusBox.tsx
+++ b/src/components/DAKStatusBox.tsx
@@ -202,9 +202,8 @@ const DAKStatusBox: React.FC<DAKStatusBoxProps> = ({ repository, selectedBranch,
               <div className="status-section">
                 <h4>🔄 Recent Commits</h4>
                 <CommitsSlider 
-                  commits={repositoryStats.recentCommits}
                   repository={repository}
-                  branch={branch}
+                  selectedBranch={branch}
                 />
               </div>
 
diff --git a/src/components/ExampleStatsDashboard.tsx b/src/components/ExampleStatsDashboard.tsx
index d3f52e1c7..6fbb4d56a 100644
--- a/src/components/ExampleStatsDashboard.tsx
+++ b/src/components/ExampleStatsDashboard.tsx
@@ -5,9 +5,9 @@
  */
 
 import React, { useState, useEffect } from 'react';
-import { createDashboard } from '../framework';
-import dataAccessLayer from '../../services/dataAccessLayer';
-import userAccessService from '../../services/userAccessService';
+import { createDashboard } from './framework/ToolDefinition';
+import dataAccessLayer from '../services/dataAccessLayer';
+import userAccessService from '../services/userAccessService';
 
 interface Repository {
   name: string;
@@ -85,7 +85,7 @@ const RepositoryStatsDashboard: React.FC<DashboardProps> = ({
       
       // In a real implementation, this would gather statistics
       // For demo purposes, we'll create mock statistics
-      const mockStats = {
+      const mockStats: Stats = {
         totalAssets: 15,
         valuesSets: 8,
         actors: 3,
@@ -94,9 +94,9 @@ const RepositoryStatsDashboard: React.FC<DashboardProps> = ({
         contributors: ['user1', 'user2', 'user3'],
         branches: ['main', 'develop', 'feature/new-guidelines'],
         recentChanges: [
-          { file: 'input/vocabulary/ValueSet-anc-care-codes.json', type: 'modified', date: '2024-01-20' },
-          { file: 'input/actors/Patient.json', type: 'added', date: '2024-01-19' },
-          { file: 'input/bpmn/anc-workflow.bpmn', type: 'modified', date: '2024-01-18' }
+          { file: 'input/vocabulary/ValueSet-anc-care-codes.json', type: 'modified' as const, date: '2024-01-20' },
+          { file: 'input/actors/Patient.json', type: 'added' as const, date: '2024-01-19' },
+          { file: 'input/bpmn/anc-workflow.bpmn', type: 'modified' as const, date: '2024-01-18' }
         ]
       };
 
@@ -115,9 +115,9 @@ const RepositoryStatsDashboard: React.FC<DashboardProps> = ({
     const userType = userAccessService.getUserType();
     const currentUser = userAccessService.getCurrentUser();
     const accessInfo = await dataAccessLayer.getAccessInfo(
-      pageParams.repository?.owner?.login,
-      pageParams.repository?.name,
-      pageParams.branch
+      pageParams.repository?.owner?.login || '',
+      pageParams.repository?.name || '',
+      pageParams.branch || ''
     );
 
     setUserInfo({
@@ -136,6 +136,15 @@ const RepositoryStatsDashboard: React.FC<DashboardProps> = ({
     );
   }
 
+  if (!stats) {
+    return (
+      <div className="dashboard-error">
+        <h2>No Statistics Available</h2>
+        <p>Unable to load statistics for {pageParams.repository?.name}</p>
+      </div>
+    );
+  }
+
   return (
     <div className="repository-stats-dashboard">
       <div className="dashboard-header">
@@ -220,7 +229,7 @@ const RepositoryStatsDashboard: React.FC<DashboardProps> = ({
         </div>
       </div>
 
-      <style jsx>{`
+      <style>{`
         .repository-stats-dashboard {
           padding: 1rem;
           max-width: 1200px;
@@ -394,11 +403,11 @@ const RepositoryStatsDashboard_Tool = createDashboard({
   supportsDemo: true,
   
   // Hooks
-  onInit: async (context) => {
+  onInit: async (context: any) => {
     console.log('Repository Stats Dashboard initialized', context);
   },
   
-  onError: (error, context) => {
+  onError: (error: any, context: any) => {
     console.error('Repository Stats Dashboard error:', error, context);
   }
 });
diff --git a/src/components/ExampleValueSetEditor.tsx b/src/components/ExampleValueSetEditor.tsx
index 792b8dada..1dc47d898 100644
--- a/src/components/ExampleValueSetEditor.tsx
+++ b/src/components/ExampleValueSetEditor.tsx
@@ -5,7 +5,7 @@
  */
 
 import React, { useState } from 'react';
-import { createAssetEditor } from '../framework';
+import { createAssetEditor } from './framework/ToolDefinition';
 
 /**
  * Tool definition structure
@@ -179,7 +179,7 @@ const ValueSetEditorComponent: React.FC<ValueSetEditorComponentProps> = ({
         </ul>
       </div>
 
-      <style jsx>{`
+      <style>{`
         .value-set-editor {
           padding: 1rem;
           max-width: 1200px;
diff --git a/src/components/ForkStatusBar.tsx b/src/components/ForkStatusBar.tsx
index 24c7acaab..23a6c7960 100644
--- a/src/components/ForkStatusBar.tsx
+++ b/src/components/ForkStatusBar.tsx
@@ -120,7 +120,7 @@ const ForkStatusBar: React.FC<ForkStatusBarProps> = ({ profile, repository, sele
   };
 
   // Handle parent repository navigation
-  const handleParentClick = (event: React.MouseEvent): void => {
+  const handleParentClick = (event: React.MouseEvent | React.KeyboardEvent): void => {
     if (!parentRepository) return;
     
     const dashboardUrl = getForkDashboardUrl(parentRepository);
diff --git a/src/components/HelpButton.tsx b/src/components/HelpButton.tsx
index 668b39f90..09b0f1553 100644
--- a/src/components/HelpButton.tsx
+++ b/src/components/HelpButton.tsx
@@ -50,8 +50,10 @@ const HelpButton: React.FC<HelpButtonProps> = ({ helpTopic, contextData = {} })
       {showHelp && (
         <HelpModal
           topic={helpTopic}
+          helpTopic={helpTopic}
           contextData={contextData}
           onClose={handleCloseHelp}
+          tutorialId={undefined}
         />
       )}
     </>
diff --git a/src/components/LoginModal.tsx b/src/components/LoginModal.tsx
index 3a009ded5..161a580b3 100644
--- a/src/components/LoginModal.tsx
+++ b/src/components/LoginModal.tsx
@@ -58,22 +58,22 @@ const LoginModal: React.FC<LoginModalProps> = ({ isOpen, onClose, onAuthSuccess
         duration 
       });
       
-      // Call success callback with token and octokit instance
-      onAuthSuccess(token.trim(), octokit, username.trim());
+      // Call success callback with token and username
+      onAuthSuccess(token.trim(), username.trim() || userResponse.data.login);
       onClose();
-    } catch (err) {
+    } catch (err: any) {
       const duration = Date.now() - startTime;
       componentLogger.apiError('GET', '/user', err);
       componentLogger.auth('PAT authentication failed', { 
-        status: err.status, 
-        message: err.message,
+        status: err?.status, 
+        message: err?.message,
         duration 
       });
       console.error('PAT authentication failed:', err);
       
-      if (err.status === 401) {
+      if (err?.status === 401) {
         setError('Invalid Personal Access Token. Please check your token and try again.');
-      } else if (err.status === 403) {
+      } else if (err?.status === 403) {
         setError("Token doesn't have sufficient permissions. Please ensure your token has 'repo' and 'read:org' scopes.");
       } else {
         setError('Authentication failed. Please check your connection and try again.');
diff --git a/src/components/PATSetupInstructions.tsx b/src/components/PATSetupInstructions.tsx
index e099f604c..a7a70a3e4 100644
--- a/src/components/PATSetupInstructions.tsx
+++ b/src/components/PATSetupInstructions.tsx
@@ -94,6 +94,7 @@ const PATSetupInstructions: React.FC = () => {
       
       <ContextualHelpMascot 
         pageId="pat-setup-instructions"
+        helpContent={null}
         position="bottom-right"
       />
     </div>
diff --git a/src/components/PersonaViewer.tsx b/src/components/PersonaViewer.tsx
index 25c08aad9..a3727f441 100644
--- a/src/components/PersonaViewer.tsx
+++ b/src/components/PersonaViewer.tsx
@@ -28,7 +28,7 @@ const PersonaViewer: React.FC = () => {
 };
 
 const PersonaViewerContent: React.FC = () => {
-  const pageContext = usePage();
+  const pageContext = usePage() as any;
   
   // All hooks must be called before any early returns
   const [actors, setActors] = useState<Actor[]>([]);
@@ -246,9 +246,9 @@ const PersonaViewerContent: React.FC = () => {
       setActors(allActors);
       setError(null);
       
-    } catch (error) {
+    } catch (error: any) {
       console.error('Error scanning for actors:', error);
-      setError(`Failed to scan repository: ${error.message}`);
+      setError(`Failed to scan repository: ${error?.message || 'Unknown error'}`);
       setScanStatus('Scan failed');
     } finally {
       setLoading(false);
diff --git a/src/components/PreviewBadge.tsx b/src/components/PreviewBadge.tsx
index 206fb282b..e035e611d 100644
--- a/src/components/PreviewBadge.tsx
+++ b/src/components/PreviewBadge.tsx
@@ -12,9 +12,11 @@ import './PreviewBadge.css';
 const MDEditor = lazy(() => import('@uiw/react-md-editor'));
 
 interface BranchInfo {
-  branch: string;
-  repo: string;
-  owner: string;
+  name: string;
+  safeName?: string;
+  branch?: string;
+  repo?: string;
+  owner?: string;
 }
 
 interface PRInfo {
@@ -116,17 +118,17 @@ const PreviewBadge: React.FC = () => {
   const [approvalStatus, setApprovalStatus] = useState<'success' | 'error' | null>(null); // 'success', 'error'
   const [approvalMessage, setApprovalMessage] = useState('');
   const [commentsPage, setCommentsPage] = useState(1);
-  const [allComments, setAllComments] = useState([]);
+  const [allComments, setAllComments] = useState<any[]>([]);
   const [hasMoreComments, setHasMoreComments] = useState(false);
   const [displayedCommentsCount, setDisplayedCommentsCount] = useState(5);
   const [showStatusUpdates, setShowStatusUpdates] = useState(true);
-  const expandedRef = useRef(null);
-  const commentRefreshIntervalRef = useRef(null);
-  const workflowRefreshIntervalRef = useRef(null);
+  const expandedRef = useRef<HTMLDivElement>(null);
+  const commentRefreshIntervalRef = useRef<NodeJS.Timeout | null>(null);
+  const workflowRefreshIntervalRef = useRef<NodeJS.Timeout | null>(null);
 
   // Custom markdown components to make links open in new tabs
   const markdownComponents = {
-    a: ({ href, children, ...props }) => (
+    a: ({ href, children, ...props }: { href?: string; children?: React.ReactNode; [key: string]: any }) => (
       <a href={href} target="_blank" rel="noopener noreferrer" {...props}>
         {children}
       </a>
@@ -165,9 +167,9 @@ const PreviewBadge: React.FC = () => {
         }
 
         setLoading(false);
-      } catch (err) {
+      } catch (err: any) {
         console.error('Error detecting branch:', err);
-        setError(err.message);
+        setError(err?.message || 'Unknown error');
         setLoading(false);
       }
     };
@@ -177,8 +179,8 @@ const PreviewBadge: React.FC = () => {
 
   // Handle clicks outside the expanded panel to close it (only if not sticky)
   useEffect(() => {
-    const handleClickOutside = (event) => {
-      if (expandedRef.current && !expandedRef.current.contains(event.target)) {
+    const handleClickOutside = (event: MouseEvent | TouchEvent) => {
+      if (expandedRef.current && !expandedRef.current.contains(event.target as Node)) {
         if (isSticky) {
           setIsSticky(false);
         }
@@ -261,7 +263,7 @@ const PreviewBadge: React.FC = () => {
     return null;
   };
 
-  const fetchPRsForBranch = async (branchName) => {
+  const fetchPRsForBranch = async (branchName: string) => {
     try {
       // Get current repository context if available
       // For now, we'll use the main repository
@@ -272,13 +274,13 @@ const PreviewBadge: React.FC = () => {
       
       return prs;
 
-    } catch (error) {
+    } catch (error: any) {
       console.debug('Failed to fetch PR info:', error);
       return [];
     }
   };
 
-  const fetchCommentsForPR = async (owner, repo, prNumber, page = 1, append = false, showLoading = true) => {
+  const fetchCommentsForPR = async (owner: string, repo: string, prNumber: number, page: number = 1, append: boolean = false, showLoading: boolean = true) => {
     try {
       if (showLoading) {
         setCommentsLoading(true);
@@ -297,7 +299,7 @@ const PreviewBadge: React.FC = () => {
       const newComments = [
         ...reviewComments.map(comment => ({ ...comment, type: 'review' })),
         ...issueComments.map(comment => ({ ...comment, type: 'issue' }))
-      ].sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
+      ].sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime());
 
       // Debug: Log comment details to understand what's being fetched
       console.debug('Comments fetched for PR discussion:', {
@@ -326,7 +328,7 @@ const PreviewBadge: React.FC = () => {
           type: c.type,
           bodyPreview: c.body?.substring(0, 100) + '...'
         })),
-        allUsernames: [...new Set(newComments.map(c => c.user?.login).filter(Boolean))]
+        allUsernames: Array.from(new Set(newComments.map(c => c.user?.login).filter(Boolean)))
       });
 
       // Process timeline events for status updates
@@ -353,12 +355,12 @@ const PreviewBadge: React.FC = () => {
 
       if (append) {
         // Append to existing comments (for load more)
-        const existingIds = new Set(allComments.map(c => c.id));
-        const uniqueNewComments = newComments.filter(c => !existingIds.has(c.id));
-        const uniqueNewEvents = relevantTimelineEvents.filter(e => !existingIds.has(e.id));
+        const existingIds = new Set(allComments.map((c: any) => c.id));
+        const uniqueNewComments = newComments.filter((c: any) => !existingIds.has(c.id));
+        const uniqueNewEvents = relevantTimelineEvents.filter((e: any) => !existingIds.has(e.id));
         
         const allNewItems = [...uniqueNewComments, ...uniqueNewEvents]
-          .sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
+          .sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime());
         
         const updatedAllComments = [...allComments, ...allNewItems];
         setAllComments(updatedAllComments);
@@ -370,7 +372,7 @@ const PreviewBadge: React.FC = () => {
       } else {
         // Replace comments (for initial load or refresh)
         const allItems = [...newComments, ...relevantTimelineEvents]
-          .sort((a, b) => new Date(b.created_at) - new Date(a.created_at));
+          .sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime());
         
         setAllComments(allItems);
         const initialDisplayCount = Math.min(5, allItems.length);
@@ -393,7 +395,7 @@ const PreviewBadge: React.FC = () => {
   };
 
   // Format timeline events into readable status updates
-  const formatTimelineEvent = (event) => {
+  const formatTimelineEvent = (event: any) => {
     switch (event.event) {
       case 'committed':
         return `📦 Pushed ${event.sha ? event.sha.substring(0, 7) : 'commit'}: ${event.message || 'No commit message'}`;
diff --git a/src/components/WelcomePage.tsx b/src/components/WelcomePage.tsx
index f483a1204..fdc9dda35 100644
--- a/src/components/WelcomePage.tsx
+++ b/src/components/WelcomePage.tsx
@@ -316,9 +316,11 @@ const WelcomePage: React.FC = () => {
         {/* PAT Help Modal */}
         {showPATHelp && (
           <HelpModal
+            topic={undefined}
             helpTopic={helpContentService.getHelpTopic('github-pat-setup')}
             contextData={{ pageId: 'welcome' }}
             onClose={() => setShowPATHelp(false)}
+            tutorialId={undefined}
           />
         )}
       </div>
diff --git a/src/components/framework/PageBreadcrumbs.tsx b/src/components/framework/PageBreadcrumbs.tsx
index 83cd31282..5af5b3dcd 100644
--- a/src/components/framework/PageBreadcrumbs.tsx
+++ b/src/components/framework/PageBreadcrumbs.tsx
@@ -40,6 +40,7 @@ interface PageBreadcrumbsProps {
  * />
  */
 const PageBreadcrumbs: React.FC<PageBreadcrumbsProps> = ({ customBreadcrumbs }) => {
+  const pageContext = usePage() as any;
   const { 
     type, 
     pageName, 
@@ -47,7 +48,12 @@ const PageBreadcrumbs: React.FC<PageBreadcrumbsProps> = ({ customBreadcrumbs })
     repository, 
     branch,
     navigate 
-  } = usePage();
+  } = pageContext;
+
+  // Type-safe navigate function wrapper
+  const navigateToPath = (path: string) => {
+    (navigate as (path: string) => void)(path);
+  };
 
   // If custom breadcrumbs are provided, use them
   if (customBreadcrumbs && customBreadcrumbs.length > 0) {
@@ -60,7 +66,7 @@ const PageBreadcrumbs: React.FC<PageBreadcrumbsProps> = ({ customBreadcrumbs })
                 <>
                   <button 
                     className="breadcrumb-link" 
-                    onClick={() => crumb.onClick ? crumb.onClick() : navigate(crumb.path || '/')}
+                    onClick={() => crumb.onClick ? crumb.onClick() : navigateToPath(crumb.path || '/')}
                     aria-label={`Navigate to ${crumb.label}`}
                   >
                     {crumb.label}
@@ -86,7 +92,7 @@ const PageBreadcrumbs: React.FC<PageBreadcrumbsProps> = ({ customBreadcrumbs })
   breadcrumbs.push({
     label: 'Select Profile',
     path: '/',
-    onClick: () => navigate('/')
+    onClick: () => navigateToPath('/')
   });
 
   // Add user context for user/DAK/asset pages
@@ -94,7 +100,7 @@ const PageBreadcrumbs: React.FC<PageBreadcrumbsProps> = ({ customBreadcrumbs })
     breadcrumbs.push({
       label: 'Select Repository',
       path: `/dak-selection/${profile.login}`,
-      onClick: () => navigate(`/dak-selection/${profile.login}`)
+      onClick: () => navigateToPath(`/dak-selection/${profile.login}`)
     });
   }
 
@@ -106,7 +112,7 @@ const PageBreadcrumbs: React.FC<PageBreadcrumbsProps> = ({ customBreadcrumbs })
       breadcrumbs.push({
         label: 'DAK Components',
         path: `/dashboard/${ownerLogin}/${repository.name}${branchPath}`,
-        onClick: () => navigate(`/dashboard/${ownerLogin}/${repository.name}${branchPath}`)
+        onClick: () => navigateToPath(`/dashboard/${ownerLogin}/${repository.name}${branchPath}`)
       });
     }
   }
@@ -158,7 +164,7 @@ const PageBreadcrumbs: React.FC<PageBreadcrumbsProps> = ({ customBreadcrumbs })
               <>
                 <button 
                   className="breadcrumb-link" 
-                  onClick={() => crumb.onClick ? crumb.onClick() : navigate(crumb.path || '/')}
+                  onClick={() => crumb.onClick ? crumb.onClick() : navigateToPath(crumb.path || '/')}
                   aria-label={`Navigate to ${crumb.label}`}
                 >
                   {crumb.label}
diff --git a/src/services/bugReportService.ts b/src/services/bugReportService.ts
index 82bb4286f..fc4e617f0 100644
--- a/src/services/bugReportService.ts
+++ b/src/services/bugReportService.ts
@@ -21,21 +21,49 @@ const ensureHtml2Canvas = async () => {
   return html2canvas;
 };
 
+/**
+ * Template body field
+ */
+export interface TemplateField {
+  /** Field type (markdown, textarea, input, dropdown, checkboxes) */
+  type: string;
+  /** Field ID */
+  id?: string;
+  /** Field attributes */
+  attributes?: {
+    label?: string;
+    description?: string;
+    placeholder?: string;
+    value?: string;
+    options?: Array<{ label: string; value: string } | string>;
+  };
+  /** Field validations */
+  validations?: {
+    required?: boolean;
+  };
+}
+
 /**
  * Issue template
- * @example { "name": "Bug Report", "about": "Create a bug report", "title": "Bug: ", "labels": ["bug"] }
+ * @example { "name": "Bug Report", "description": "Create a bug report", "title": "Bug: ", "labels": ["bug"] }
  */
 export interface IssueTemplate {
+  /** Template ID */
+  id?: string;
   /** Template name */
   name: string;
   /** Template description */
-  about: string;
+  description?: string;
+  /** Template about (legacy) */
+  about?: string;
+  /** Template type (bug, feature, etc.) */
+  type?: string;
   /** Default title prefix */
   title?: string;
   /** Default labels */
   labels?: string[];
   /** Template body */
-  body?: string;
+  body?: TemplateField[] | string;
   /** Assignees */
   assignees?: string[];
 }
@@ -190,14 +218,29 @@ class BugReportService {
 
       const yaml = await lazyLoadYaml();
       const frontMatter = yaml.load(frontMatterMatch[1]) as any;
-      const body = frontMatterMatch[2];
+      const bodyContent = frontMatterMatch[2];
+
+      // Determine template type based on labels
+      let templateType = 'general';
+      if (frontMatter.labels) {
+        if (frontMatter.labels.includes('bug')) templateType = 'bug';
+        else if (frontMatter.labels.includes('enhancement') || frontMatter.labels.includes('feature')) templateType = 'feature';
+        else if (frontMatter.labels.includes('question')) templateType = 'question';
+        else if (frontMatter.labels.includes('documentation')) templateType = 'documentation';
+      }
+
+      // Generate ID from name
+      const id = (frontMatter.name || 'unnamed').toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '');
 
       return {
+        id,
         name: frontMatter.name || 'Unnamed Template',
-        about: frontMatter.about || '',
+        description: frontMatter.about || frontMatter.description || '',
+        about: frontMatter.about || frontMatter.description || '',
+        type: templateType,
         title: frontMatter.title || '',
         labels: frontMatter.labels || [],
-        body: body.trim(),
+        body: bodyContent.trim(),
         assignees: frontMatter.assignees || []
       };
     } catch (error) {
@@ -214,12 +257,27 @@ class BugReportService {
       const yaml = await lazyLoadYaml();
       const data = yaml.load(content) as any;
 
+      // Determine template type based on labels
+      let templateType = 'general';
+      if (data.labels) {
+        if (data.labels.includes('bug')) templateType = 'bug';
+        else if (data.labels.includes('enhancement') || data.labels.includes('feature')) templateType = 'feature';
+        else if (data.labels.includes('question')) templateType = 'question';
+        else if (data.labels.includes('documentation')) templateType = 'documentation';
+      }
+
+      // Generate ID from name
+      const id = (data.name || 'unnamed').toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '');
+
       return {
+        id,
         name: data.name || 'Unnamed Template',
+        description: data.description || data.about || '',
         about: data.about || data.description || '',
+        type: templateType,
         title: data.title || '',
         labels: data.labels || [],
-        body: data.body || '',
+        body: data.body || [],
         assignees: data.assignees || []
       };
     } catch (error) {
@@ -234,18 +292,139 @@ class BugReportService {
   _getDefaultTemplates(): IssueTemplate[] {
     return [
       {
+        id: 'bug-report',
         name: 'Bug Report',
+        description: 'Create a report to help us improve',
         about: 'Create a report to help us improve',
+        type: 'bug',
         title: 'Bug: ',
         labels: ['bug'],
-        body: `## Bug Description\n\n## Steps to Reproduce\n\n## Expected Behavior\n\n## Actual Behavior\n\n## Environment\n- Browser:\n- OS:\n`
+        body: [
+          {
+            type: 'markdown',
+            attributes: {
+              value: 'Thanks for taking the time to fill out this bug report!'
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'description',
+            attributes: {
+              label: 'Bug Description',
+              description: 'A clear and concise description of what the bug is.',
+              placeholder: 'Describe the bug...'
+            },
+            validations: {
+              required: true
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'steps',
+            attributes: {
+              label: 'Steps to Reproduce',
+              description: 'Steps to reproduce the behavior',
+              placeholder: '1. Go to...\n2. Click on...\n3. See error...'
+            },
+            validations: {
+              required: true
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'expected',
+            attributes: {
+              label: 'Expected Behavior',
+              description: 'What did you expect to happen?'
+            },
+            validations: {
+              required: true
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'actual',
+            attributes: {
+              label: 'Actual Behavior',
+              description: 'What actually happened?'
+            },
+            validations: {
+              required: true
+            }
+          },
+          {
+            type: 'input',
+            id: 'browser',
+            attributes: {
+              label: 'Browser',
+              placeholder: 'e.g. Chrome 120, Firefox 121, Safari 17'
+            }
+          },
+          {
+            type: 'input',
+            id: 'os',
+            attributes: {
+              label: 'Operating System',
+              placeholder: 'e.g. Windows 11, macOS 14, Ubuntu 22.04'
+            }
+          }
+        ]
       },
       {
+        id: 'feature-request',
         name: 'Feature Request',
+        description: 'Suggest an idea for this project',
         about: 'Suggest an idea for this project',
+        type: 'feature',
         title: 'Feature: ',
         labels: ['enhancement'],
-        body: `## Feature Description\n\n## Use Case\n\n## Proposed Solution\n\n## Alternatives Considered\n`
+        body: [
+          {
+            type: 'markdown',
+            attributes: {
+              value: 'Thanks for suggesting a new feature!'
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'description',
+            attributes: {
+              label: 'Feature Description',
+              description: 'A clear and concise description of the feature you\'d like to see.',
+              placeholder: 'Describe the feature...'
+            },
+            validations: {
+              required: true
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'use-case',
+            attributes: {
+              label: 'Use Case',
+              description: 'Explain how this feature would be used and who would benefit from it.'
+            },
+            validations: {
+              required: true
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'solution',
+            attributes: {
+              label: 'Proposed Solution',
+              description: 'How do you envision this feature working?'
+            }
+          },
+          {
+            type: 'textarea',
+            id: 'alternatives',
+            attributes: {
+              label: 'Alternatives Considered',
+              description: 'Are there alternative solutions or workarounds you\'ve considered?'
+            }
+          }
+        ]
       }
     ];
   }
@@ -391,6 +570,218 @@ class BugReportService {
     // Fetch fresh templates
     return await this.fetchIssueTemplates(repoOwner, repoName);
   }
+
+  /**
+   * Get default templates (public method)
+   * @returns Array of default issue templates
+   */
+  getDefaultTemplates(): IssueTemplate[] {
+    return this._getDefaultTemplates();
+  }
+
+  /**
+   * Take a screenshot of the current page
+   * @returns Promise resolving to a Blob of the screenshot, or null if capture fails
+   */
+  async takeScreenshot(): Promise<Blob | null> {
+    try {
+      const html2canvasModule = await ensureHtml2Canvas();
+      const canvas = await html2canvasModule(document.body, {
+        allowTaint: true,
+        useCORS: true,
+        logging: false
+      });
+      
+      return new Promise<Blob | null>((resolve) => {
+        canvas.toBlob((blob) => {
+          resolve(blob);
+        }, 'image/png');
+      });
+    } catch (error) {
+      console.error('Error taking screenshot:', error);
+      return null;
+    }
+  }
+
+  /**
+   * Generate a GitHub issue URL with pre-filled data
+   * @param owner - Repository owner
+   * @param repo - Repository name
+   * @param template - Issue template
+   * @param formData - Form field values
+   * @param includeConsole - Whether to include console output
+   * @param consoleOutput - Console output logs
+   * @param contextData - Additional context data
+   * @param screenshot - Screenshot blob (will be noted but not embedded)
+   * @returns GitHub issue creation URL
+   */
+  generateIssueUrl(
+    owner: string,
+    repo: string,
+    template: IssueTemplate,
+    formData: Record<string, any>,
+    includeConsole: boolean,
+    consoleOutput: string[] | string,
+    contextData?: Record<string, any>,
+    screenshot?: Blob | null
+  ): string {
+    const baseUrl = `https://github.com/${owner}/${repo}/issues/new`;
+    const params = new URLSearchParams();
+
+    // Add template if it has an ID
+    if (template.id) {
+      params.append('template', `${template.id}.yml`);
+    }
+
+    // Add title
+    const title = template.title || '';
+    params.append('title', title);
+
+    // Add labels
+    if (template.labels && template.labels.length > 0) {
+      params.append('labels', template.labels.join(','));
+    }
+
+    // Build body from form data
+    let body = '';
+    
+    // Add form field values
+    if (Array.isArray(template.body)) {
+      for (const field of template.body) {
+        if (field.type === 'markdown') continue;
+        
+        const fieldId = field.id;
+        if (fieldId && formData[fieldId]) {
+          const label = field.attributes?.label || fieldId;
+          body += `### ${label}\n${formData[fieldId]}\n\n`;
+        }
+      }
+    }
+
+    // Add context information
+    if (contextData) {
+      body += '\n---\n\n### Context Information\n';
+      if (contextData.pageId) body += `**Page:** ${contextData.pageId}\n`;
+      if (contextData.repository) body += `**Repository:** ${contextData.repository.name || contextData.repository}\n`;
+      if (contextData.branch) body += `**Branch:** ${contextData.branch}\n`;
+      body += `**URL:** ${window.location.href}\n`;
+      body += `**User Agent:** ${navigator.userAgent}\n`;
+    }
+
+    // Add console output if included
+    if (includeConsole && consoleOutput) {
+      const logs = Array.isArray(consoleOutput) ? consoleOutput.join('\n') : consoleOutput;
+      if (logs.length > 0) {
+        body += '\n---\n\n### Console Output\n```\n';
+        // Limit console output to avoid URL length issues
+        const truncated = logs.length > 5000 ? logs.substring(0, 5000) + '\n... (truncated)' : logs;
+        body += truncated;
+        body += '\n```\n';
+      }
+    }
+
+    // Note about screenshot if included
+    if (screenshot) {
+      body += '\n---\n\n_Note: A screenshot was captured but cannot be automatically attached via URL. Please paste it manually after creating the issue._\n';
+    }
+
+    params.append('body', body);
+
+    return `${baseUrl}?${params.toString()}`;
+  }
+
+  /**
+   * Submit an issue directly via GitHub API
+   * @param owner - Repository owner
+   * @param repo - Repository name
+   * @param template - Issue template
+   * @param formData - Form field values
+   * @param includeConsole - Whether to include console output
+   * @param consoleOutput - Console output logs
+   * @param contextData - Additional context data
+   * @param screenshot - Screenshot blob
+   * @returns Promise resolving to submission result
+   */
+  async submitIssue(
+    owner: string,
+    repo: string,
+    template: IssueTemplate,
+    formData: Record<string, any>,
+    includeConsole: boolean,
+    consoleOutput: string[] | string,
+    contextData?: Record<string, any>,
+    screenshot?: Blob | null
+  ): Promise<{ success: boolean; issue?: any; error?: any }> {
+    try {
+      // Build title
+      const title = (template.title || '') + (formData.title || formData.description?.substring(0, 50) || 'New Issue');
+
+      // Build body
+      let body = '';
+      
+      // Add form field values
+      if (Array.isArray(template.body)) {
+        for (const field of template.body) {
+          if (field.type === 'markdown') continue;
+          
+          const fieldId = field.id;
+          if (fieldId && formData[fieldId]) {
+            const label = field.attributes?.label || fieldId;
+            body += `### ${label}\n${formData[fieldId]}\n\n`;
+          }
+        }
+      }
+
+      // Add context information
+      if (contextData) {
+        body += '\n---\n\n### Context Information\n';
+        if (contextData.pageId) body += `**Page:** ${contextData.pageId}\n`;
+        if (contextData.repository) body += `**Repository:** ${contextData.repository.name || contextData.repository}\n`;
+        if (contextData.branch) body += `**Branch:** ${contextData.branch}\n`;
+        body += `**URL:** ${window.location.href}\n`;
+        body += `**User Agent:** ${navigator.userAgent}\n`;
+      }
+
+      // Add console output if included
+      if (includeConsole && consoleOutput) {
+        const logs = Array.isArray(consoleOutput) ? consoleOutput.join('\n') : consoleOutput;
+        if (logs.length > 0) {
+          body += '\n---\n\n### Console Output\n```\n' + logs + '\n```\n';
+        }
+      }
+
+      // Create issue via issueTrackingService
+      const issue = await issueTrackingService.createIssue(owner, repo, {
+        title,
+        body,
+        labels: template.labels || []
+      });
+
+      if (!issue) {
+        return {
+          success: false,
+          error: { message: 'Failed to create issue' }
+        };
+      }
+
+      // TODO: Upload screenshot as comment if provided
+      // This would require additional API call to add a comment with the image
+
+      return {
+        success: true,
+        issue
+      };
+    } catch (error: any) {
+      console.error('Error submitting issue:', error);
+      return {
+        success: false,
+        error: {
+          message: error.message || 'Failed to submit issue',
+          details: error
+        }
+      };
+    }
+  }
 }
 
 // Export singleton instance
diff --git a/src/services/githubService.ts b/src/services/githubService.ts
index 07c7fc9d6..6809c6d08 100644
--- a/src/services/githubService.ts
+++ b/src/services/githubService.ts
@@ -317,6 +317,75 @@ class GitHubService {
     }
   }
 
+  /**
+   * Get pull request review comments with pagination support
+   */
+  async getPullRequestComments(owner: string, repo: string, pull_number: number, page: number = 1, per_page: number = 30): Promise<any[]> {
+    if (!this.isAuthenticated || !this.octokit) {
+      throw new Error('Not authenticated');
+    }
+
+    try {
+      const { data } = await this.octokit.rest.pulls.listReviewComments({
+        owner,
+        repo,
+        pull_number,
+        page,
+        per_page
+      });
+      return data;
+    } catch (error: any) {
+      this.logger.error('Failed to get pull request review comments', { owner, repo, pull_number, error });
+      return [];
+    }
+  }
+
+  /**
+   * Get pull request issue comments
+   */
+  async getPullRequestIssueComments(owner: string, repo: string, pull_number: number, page: number = 1, per_page: number = 30): Promise<any[]> {
+    if (!this.isAuthenticated || !this.octokit) {
+      throw new Error('Not authenticated');
+    }
+
+    try {
+      const { data } = await this.octokit.rest.issues.listComments({
+        owner,
+        repo,
+        issue_number: pull_number,
+        page,
+        per_page
+      });
+      return data;
+    } catch (error: any) {
+      this.logger.error('Failed to get pull request issue comments', { owner, repo, pull_number, error });
+      return [];
+    }
+  }
+
+  /**
+   * Get pull request timeline events
+   */
+  async getPullRequestTimeline(owner: string, repo: string, pull_number: number, page: number = 1, per_page: number = 30): Promise<any[]> {
+    if (!this.isAuthenticated || !this.octokit) {
+      throw new Error('Not authenticated');
+    }
+
+    try {
+      const { data } = await this.octokit.rest.issues.listEventsForTimeline({
+        owner,
+        repo,
+        issue_number: pull_number,
+        page,
+        per_page
+      });
+      return data;
+    } catch (error: any) {
+      this.logger.error('Failed to get pull request timeline', { owner, repo, pull_number, error });
+      return [];
+    }
+  }
+
   /**
    * Create a new issue
    */
@@ -358,6 +427,59 @@ class GitHubService {
     }
   }
 
+  /**
+   * Get repository statistics including recent commits, PRs, and issues
+   * @param owner - Repository owner
+   * @param repo - Repository name
+   * @param branch - Branch name (optional)
+   * @returns Promise resolving to repository statistics
+   */
+  async getRepositoryStats(owner: string, repo: string, branch?: string): Promise<{
+    recentCommits: any[];
+    openPullRequestsCount: number;
+    openIssuesCount: number;
+  }> {
+    try {
+      const octokit = this.isAuthenticated && this.octokit ? this.octokit : await this.createOctokitInstance();
+      
+      // Get recent commits
+      const commitsOptions: any = {
+        owner,
+        repo,
+        per_page: 5
+      };
+      if (branch) {
+        commitsOptions.sha = branch;
+      }
+      const { data: recentCommits } = await octokit.rest.repos.listCommits(commitsOptions);
+
+      // Get open PRs count
+      const { data: pullRequests } = await octokit.rest.pulls.list({
+        owner,
+        repo,
+        state: 'open',
+        per_page: 1
+      });
+
+      // Get open issues count
+      const { data: issues } = await octokit.rest.issues.listForRepo({
+        owner,
+        repo,
+        state: 'open',
+        per_page: 1
+      });
+
+      return {
+        recentCommits,
+        openPullRequestsCount: pullRequests.length,
+        openIssuesCount: issues.length
+      };
+    } catch (error) {
+      this.logger.error('Failed to get repository stats', { owner, repo, branch, error });
+      throw error;
+    }
+  }
+
   /**
    * Check if user has write access to repository
    */
@@ -380,6 +502,53 @@ class GitHubService {
     }
   }
 
+  /**
+   * Get repository forks
+   * @param owner - Repository owner
+   * @param repo - Repository name
+   * @returns Promise resolving to array of fork repositories
+   */
+  async getRepositoryForks(owner: string, repo: string): Promise<any[]> {
+    try {
+      const octokit = this.isAuthenticated && this.octokit ? this.octokit : await this.createOctokitInstance();
+      const { data } = await octokit.rest.repos.listForks({
+        owner,
+        repo,
+        per_page: 100
+      });
+      return data;
+    } catch (error) {
+      this.logger.error('Failed to get repository forks', { owner, repo, error });
+      throw error;
+    }
+  }
+
+  /**
+   * Get pull requests for a specific branch
+   * 
+   * @param owner - Repository owner
+   * @param repo - Repository name
+   * @param branchName - Branch name to filter PRs
+   * @returns Promise<any[]> Array of pull requests
+   */
+  async getPullRequestsForBranch(owner: string, repo: string, branchName: string): Promise<any[]> {
+    try {
+      const octokit = this.isAuthenticated && this.octokit ? this.octokit : await this.createOctokitInstance();
+      const { data } = await octokit.rest.pulls.list({
+        owner,
+        repo,
+        head: `${owner}:${branchName}`,
+        state: 'all',
+        per_page: 100
+      });
+      return data;
+    } catch (error: any) {
+      this.logger.error('Failed to get pull requests for branch', { owner, repo, branchName, error });
+      // Return empty array instead of throwing to allow graceful degradation
+      return [];
+    }
+  }
+
   /**
    * Get commits for a repository
    * 
@@ -410,6 +579,28 @@ class GitHubService {
     }
   }
 
+  /**
+   * Get a single commit with its details
+   * @param owner - Repository owner
+   * @param repo - Repository name
+   * @param ref - Commit SHA or ref
+   * @returns Promise resolving to commit data
+   */
+  async getCommit(owner: string, repo: string, ref: string): Promise<any> {
+    try {
+      const octokit = this.isAuthenticated && this.octokit ? this.octokit : await this.createOctokitInstance();
+      const { data } = await octokit.rest.repos.getCommit({
+        owner,
+        repo,
+        ref
+      });
+      return data;
+    } catch (error) {
+      this.logger.error('Failed to get commit', { owner, repo, ref, error });
+      throw error;
+    }
+  }
+
   /**
    * Get branches from a GitHub repository
    * 
diff --git a/src/services/tutorialService.ts b/src/services/tutorialService.ts
index 704910b2f..26b7ef276 100644
--- a/src/services/tutorialService.ts
+++ b/src/services/tutorialService.ts
@@ -305,6 +305,104 @@ class TutorialService {
     const currentStep = tutorial.steps.find(s => s.id === currentStepId);
     return currentStep ? !currentStep.nextSteps || currentStep.nextSteps.length === 0 : false;
   }
+
+  /**
+   * Load tutorial progress from localStorage
+   * @param tutorialId - Tutorial ID
+   * @param contextData - Context data (currently unused but kept for API compatibility)
+   * @returns Saved progress or null
+   */
+  loadTutorialProgress(tutorialId: string, contextData?: any): { state: { currentStepIndex: number; context: any } } | null {
+    try {
+      const key = `tutorial-progress-${tutorialId}`;
+      const saved = localStorage.getItem(key);
+      if (saved) {
+        return JSON.parse(saved);
+      }
+    } catch (error) {
+      console.error('Failed to load tutorial progress:', error);
+    }
+    return null;
+  }
+
+  /**
+   * Save tutorial progress to localStorage
+   * @param tutorialId - Tutorial ID
+   * @param state - State object with currentStepIndex and context
+   * @param contextData - Context data (currently unused but kept for API compatibility)
+   */
+  saveTutorialProgress(tutorialId: string, state: { currentStepIndex: number; context: any }, contextData?: any): void {
+    try {
+      const key = `tutorial-progress-${tutorialId}`;
+      const progress = {
+        state: state,
+        savedAt: new Date().toISOString()
+      };
+      localStorage.setItem(key, JSON.stringify(progress));
+    } catch (error) {
+      console.error('Failed to save tutorial progress:', error);
+    }
+  }
+
+  /**
+   * Clear tutorial progress from localStorage
+   * @param tutorialId - Tutorial ID
+   */
+  clearTutorialProgress(tutorialId: string): void {
+    try {
+      const key = `tutorial-progress-${tutorialId}`;
+      localStorage.removeItem(key);
+    } catch (error) {
+      console.error('Failed to clear tutorial progress:', error);
+    }
+  }
+
+  /**
+   * Process a tutorial step and determine next step
+   * @param tutorial - Tutorial definition (can be any object with steps array)
+   * @param currentStepIndex - Current step index
+   * @param userChoice - User's choice (for branching)
+   * @param tutorialState - Current tutorial state
+   * @returns Step result with completion status and next index
+   */
+  processStep(
+    tutorial: any, 
+    currentStepIndex: number, 
+    userChoice: string | null, 
+    tutorialState: Record<string, any>
+  ): { isComplete: boolean; stepIndex?: number; context?: Record<string, any> } {
+    const currentStep = tutorial.steps[currentStepIndex];
+    
+    if (!currentStep) {
+      return { isComplete: true };
+    }
+
+    // Check if this is the last step
+    if (!currentStep.nextSteps || currentStep.nextSteps.length === 0) {
+      return { isComplete: true };
+    }
+
+    // Determine next step based on user choice or default
+    let nextStepId: string;
+    if (userChoice && currentStep.nextSteps.includes(userChoice)) {
+      nextStepId = userChoice;
+    } else {
+      nextStepId = currentStep.nextSteps[0];
+    }
+
+    // Find the index of the next step
+    const nextStepIndex = tutorial.steps.findIndex(s => s.id === nextStepId);
+    
+    if (nextStepIndex === -1) {
+      return { isComplete: true };
+    }
+
+    return {
+      isComplete: false,
+      stepIndex: nextStepIndex - 1, // Subtract 1 because the caller will add 1
+      context: tutorialState
+    };
+  }
 }
 
 // Export singleton instance
diff --git a/src/utils/navigationUtils.ts b/src/utils/navigationUtils.ts
index 67ebe2c97..9fff786ac 100644
--- a/src/utils/navigationUtils.ts
+++ b/src/utils/navigationUtils.ts
@@ -2,6 +2,8 @@
  * Utility functions for handling navigation with command-click support
  */
 
+import React from 'react';
+
 /**
  * React Router location object type
  */
@@ -14,10 +16,10 @@ export interface Location {
 
 /**
  * Detects if a click event should open in a new tab
- * @param event - The click event
- * @returns True if should open in new tab (Ctrl/Cmd+click)
+ * @param event - The click or keyboard event
+ * @returns True if should open in new tab (Ctrl/Cmd+click or Ctrl/Cmd+Enter)
  */
-export const shouldOpenInNewTab = (event: MouseEvent): boolean => {
+export const shouldOpenInNewTab = (event: React.MouseEvent | MouseEvent | React.KeyboardEvent | KeyboardEvent): boolean => {
   return !!(event?.ctrlKey || event?.metaKey); // Ctrl on Windows/Linux, Cmd on Mac
 };
 
@@ -87,14 +89,14 @@ export const navigateToWelcomeWithFocus = (
 export type NavigateFunction = (to: string, options?: { state?: any }) => void;
 
 /**
- * Handles navigation with command-click support
- * @param event - The click event
+ * Handles navigation with command-click support and keyboard navigation
+ * @param event - The click or keyboard event
  * @param path - The navigation path
  * @param navigate - React Router navigate function
  * @param state - Optional state to pass with navigation
  */
 export const handleNavigationClick = (
-  event: MouseEvent, 
+  event: React.MouseEvent | MouseEvent | React.KeyboardEvent | KeyboardEvent, 
   path: string, 
   navigate: NavigateFunction, 
   state: any = null