fix: Repair Inspector TypeScript errors (props and unused vars)

company-explorer/frontend/src/components/Inspector.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react'
 import axios from 'axios'
-import { X, ExternalLink, Bot, Briefcase, Calendar, Globe, Users, DollarSign, MapPin, Tag, RefreshCw as RefreshCwIcon, Search as SearchIcon, Pencil, Check, Download, Clock, Lock, Unlock, Calculator, Ruler, Database, Trash2, Flag, AlertTriangle, Scale, Target } from 'lucide-react'
+import { X, ExternalLink, Bot, Briefcase, Globe, Users, DollarSign, MapPin, Tag, RefreshCw as RefreshCwIcon, Search as SearchIcon, Pencil, Check, Download, Clock, Lock, Unlock, Calculator, Ruler, Database, Trash2, Flag, AlertTriangle, Scale, Target, Save } from 'lucide-react'
 import clsx from 'clsx'
 import { ContactsManager, Contact } from './ContactsManager'
 
@@ -409,7 +409,7 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
   const impressum = scrapeData?.impressum
   const scrapeDate = scrapeEntry?.created_at
 
-  // NEW: Strategy Card Renderer
+  // Strategy Card Renderer
   const renderStrategyCard = () => {
     if (!data?.industry_details) return null;
     const { pains, gains, priority, notes } = data.industry_details;
@@ -421,7 +421,6 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
         </h3>
         
         <div className="grid gap-4">
-           {/* Priority Badge */}
            <div className="flex items-center gap-2">
               <span className="text-xs text-slate-500 font-bold uppercase">Status:</span>
               <span className={clsx("px-2 py-0.5 rounded text-xs font-bold", 
@@ -429,7 +428,6 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
               )}>{priority || "N/A"}</span>
            </div>
 
-           {/* Pains */}
            {pains && (
              <div>
                <div className="text-[10px] text-red-600 dark:text-red-400 uppercase font-bold tracking-tight mb-1">Pain Points</div>
@@ -437,7 +435,6 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
              </div>
            )}
            
-           {/* Gains */}
            {gains && (
              <div>
                <div className="text-[10px] text-green-600 dark:text-green-400 uppercase font-bold tracking-tight mb-1">Gain Points</div>
@@ -445,7 +442,6 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
              </div>
            )}
            
-           {/* Internal Notes */}
            {notes && (
              <div className="pt-2 border-t border-purple-200 dark:border-purple-800">
                 <div className="text-[10px] text-purple-500 uppercase font-bold tracking-tight">Internal Notes</div>
@@ -457,9 +453,8 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
     )
   }
 
-  // NEW: CRM Comparison Renderer
+  // CRM Comparison Renderer
   const renderCRMComparison = () => {
-    // Only show if CRM data exists
     if (!data?.crm_name && !data?.crm_website) return null;
     
     return (
@@ -478,7 +473,6 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
          </div>
          
          <div className="grid grid-cols-2 gap-4 text-xs">
-            {/* Left: CRM (ReadOnly) */}
             <div className="p-3 bg-slate-100 dark:bg-slate-900 rounded opacity-80">
                 <div className="text-[10px] font-bold text-slate-400 uppercase mb-2">SuperOffice (CRM)</div>
                 <div className="space-y-2">
@@ -489,7 +483,6 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
                 </div>
             </div>
             
-            {/* Right: AI (Golden Record) */}
             <div className="p-3 bg-white dark:bg-slate-800 rounded border border-blue-100 dark:border-blue-900">
                 <div className="text-[10px] font-bold text-blue-500 uppercase mb-2">Company Explorer (AI)</div>
                 <div className="space-y-2">
@@ -627,6 +620,47 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
               </div>
             )}
 
+            {/* Mistake Report Form (Missing in previous version) */}
+            {isReportingMistake && (
+                <div className="mt-4 p-4 bg-slate-100 dark:bg-slate-800 rounded border border-slate-200 dark:border-slate-700 animate-in slide-in-from-top-2">
+                    <h4 className="text-sm font-bold mb-3 flex justify-between items-center">
+                        Report a Data Error
+                        <button onClick={() => setIsReportingMistake(false)} className="text-slate-400 hover:text-red-500"><X className="h-4 w-4"/></button>
+                    </h4>
+                    <div className="space-y-3">
+                        <div>
+                            <label className="block text-[10px] uppercase font-bold text-slate-500 mb-1">Field Name (Required)</label>
+                            <input className="w-full text-xs p-2 rounded border dark:bg-slate-900 dark:border-slate-700" value={reportedFieldName} onChange={e => setReportedFieldName(e.target.value)} placeholder="e.g. Revenue, Employee Count" />
+                        </div>
+                        <div className="grid grid-cols-2 gap-2">
+                            <div>
+                                <label className="block text-[10px] uppercase font-bold text-slate-500 mb-1">Wrong Value</label>
+                                <input className="w-full text-xs p-2 rounded border dark:bg-slate-900 dark:border-slate-700" value={reportedWrongValue} onChange={e => setReportedWrongValue(e.target.value)} />
+                            </div>
+                            <div>
+                                <label className="block text-[10px] uppercase font-bold text-slate-500 mb-1">Correct Value</label>
+                                <input className="w-full text-xs p-2 rounded border dark:bg-slate-900 dark:border-slate-700" value={reportedCorrectedValue} onChange={e => setReportedCorrectedValue(e.target.value)} />
+                            </div>
+                        </div>
+                        <div>
+                            <label className="block text-[10px] uppercase font-bold text-slate-500 mb-1">Source URL / Proof</label>
+                            <input className="w-full text-xs p-2 rounded border dark:bg-slate-900 dark:border-slate-700" value={reportedSourceUrl} onChange={e => setReportedSourceUrl(e.target.value)} />
+                        </div>
+                        <div>
+                            <label className="block text-[10px] uppercase font-bold text-slate-500 mb-1">Comment</label>
+                            <textarea className="w-full text-xs p-2 rounded border dark:bg-slate-900 dark:border-slate-700" rows={2} value={reportedComment} onChange={e => setReportedComment(e.target.value)} />
+                        </div>
+                        <button 
+                            onClick={handleReportMistake}
+                            disabled={isProcessing}
+                            className="w-full bg-orange-600 hover:bg-orange-700 text-white py-2 rounded text-xs font-bold"
+                        >
+                            SUBMIT REPORT
+                        </button>
+                    </div>
+                </div>
+            )}
+
             <div className="mt-6 flex border-b border-slate-200 dark:border-slate-800">
               <button
                 onClick={() => setActiveTab('overview')}
@@ -681,7 +715,6 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
                   </button>
                 </div>
 
-                {/* NEW: Comparison & Strategy */}
                 {renderCRMComparison()}
                 {renderStrategyCard()}
 
@@ -1134,7 +1167,12 @@ export function Inspector({ companyId, initialContactId, onClose, apiBase }: Ins
             )}
             
             {activeTab === 'contacts' && (
-                <ContactsManager companyId={companyId} apiBase={apiBase} />
+                <ContactsManager 
+                    contacts={data.contacts} 
+                    initialContactId={initialContactId}
+                    onAddContact={handleAddContact} 
+                    onEditContact={handleEditContact} 
+                />
             )}
           </div>
         </div>