feat(market-intel): complete end-to-end audit with enhanced UX and grounding

- Integrated ICP-based lookalike sourcing.
- Implemented Deep Tech Audit with automated evidence collection.
- Enhanced processing terminal with real-time logs.
- Refined daily logging and resolved all dependency issues.
- Documented final status and next steps.
This commit is contained in:
2025-12-21 22:39:30 +00:00
parent 3f36937080
commit e4aad40344
10 changed files with 511 additions and 141 deletions

View File

@@ -15,7 +15,7 @@ export const StepProcessing: React.FC<StepProcessingProps> = ({ state }) => {
if (terminalRef.current) {
terminalRef.current.scrollTop = terminalRef.current.scrollHeight;
}
}, [state.completed, state.currentCompany]);
}, [state.completed, state.currentCompany, state.terminalLogs]);
return (
<div className="max-w-3xl mx-auto mt-12 px-4">
@@ -29,7 +29,7 @@ export const StepProcessing: React.FC<StepProcessingProps> = ({ state }) => {
<div className="bg-white p-6 rounded-xl shadow-sm border border-slate-200 mb-6">
<div className="flex justify-between text-sm font-medium text-slate-700 mb-2">
<span>Progress</span>
<span>Overall Progress</span>
<span>{percentage}% ({state.completed}/{state.total})</span>
</div>
<div className="w-full bg-slate-100 rounded-full h-4 overflow-hidden">
@@ -37,27 +37,25 @@ export const StepProcessing: React.FC<StepProcessingProps> = ({ state }) => {
</div>
</div>
<div className="bg-slate-900 rounded-xl shadow-xl overflow-hidden font-mono text-sm">
<div className="bg-slate-800 px-4 py-2 flex items-center gap-2 border-b border-slate-700">
<div className="w-3 h-3 rounded-full bg-red-500"></div>
<div className="w-3 h-3 rounded-full bg-yellow-500"></div>
<div className="w-3 h-3 rounded-full bg-green-500"></div>
<span className="ml-2 text-slate-400 text-xs">audit_agent.exe</span>
<div className="bg-slate-900 rounded-xl shadow-xl overflow-hidden font-mono text-sm border border-slate-700">
<div className="bg-slate-800 px-4 py-2 flex items-center justify-between border-b border-slate-700">
<div className="flex gap-2">
<div className="w-3 h-3 rounded-full bg-red-500/80"></div>
<div className="w-3 h-3 rounded-full bg-yellow-500/80"></div>
<div className="w-3 h-3 rounded-full bg-green-500/80"></div>
</div>
<span className="text-slate-500 text-[10px] uppercase font-bold tracking-widest">Deep Tech Audit Session</span>
</div>
<div ref={terminalRef} className="p-6 h-64 overflow-y-auto text-slate-300 space-y-2 scroll-smooth">
<div className="text-emerald-400">$ load_strategy --context="custom"</div>
{state.completed > 0 && <div className="text-slate-500">... {state.completed} companies analyzed.</div>}
{state.currentCompany && (
<>
<div className="animate-pulse text-indigo-300">{`> Analyzing: ${state.currentCompany}`}</div>
<div className="pl-4 border-l-2 border-slate-700 space-y-1 mt-2">
<div className="flex items-center gap-2 text-emerald-400"><TrendingUp size={14} /> Fetching Firmographics (Revenue/Size)...</div>
<div className="flex items-center gap-2"><Eye size={14} /> Scanning Custom Signals...</div>
<div className="flex items-center gap-2"><Search size={14} /> Validating against ICP...</div>
</div>
</>
)}
<div ref={terminalRef} className="p-6 h-80 overflow-y-auto text-slate-300 space-y-1.5 scroll-smooth scrollbar-thin scrollbar-thumb-slate-700">
{state.terminalLogs?.map((log, idx) => (
<div key={idx} className="flex gap-3 animate-in fade-in slide-in-from-left-2 duration-300">
<span className="text-slate-600 shrink-0">[{new Date().toLocaleTimeString([], {hour: '2-digit', minute:'2-digit', second: '2-digit'})}]</span>
<span className={log.startsWith('>') ? 'text-indigo-400 font-bold' : log.includes('✓') ? 'text-emerald-400' : 'text-slate-300'}>
{log}
</span>
</div>
))}
{!state.terminalLogs?.length && <div className="text-slate-500 italic">Initializing agent...</div>}
</div>
</div>
</div>

View File

@@ -145,8 +145,7 @@ ${rows.join("\n")}
{/* Dynamic Signals Stacked */}
<div className="grid gap-4">
{strategy.signals.map((s, i) => {
const data = row.dynamicAnalysis[s.id];
if (!data) return null;
const data = row.dynamicAnalysis && row.dynamicAnalysis[s.id];
return (
<div key={s.id} className="group">
<div className="flex items-center gap-2 mb-1">
@@ -156,10 +155,10 @@ ${rows.join("\n")}
<span className="text-xs font-bold text-slate-500 uppercase tracking-wide">{s.name}</span>
</div>
<div className="pl-7">
<div className="text-sm text-slate-900 font-medium leading-snug">
{data.value}
<div className={`text-sm font-medium leading-snug ${data ? 'text-slate-900' : 'text-slate-400 italic'}`}>
{data ? data.value : "Nicht geprüft / N/A"}
</div>
{data.proof && (
{data && data.proof && (
<div className="mt-1.5 inline-flex items-center gap-1.5 text-xs text-slate-500 bg-slate-50 px-2 py-1 rounded border border-slate-100 max-w-full">
<Search size={10} />
<span className="truncate max-w-[400px]">Evidence: {data.proof}</span>

View File

@@ -1,10 +1,15 @@
import React, { useState } from 'react';
import { Trash2, Plus, CheckCircle2, ExternalLink, FileText } from 'lucide-react';
import { Trash2, Plus, CheckCircle2, ExternalLink, FileText, Globe, Landmark, MapPin } from 'lucide-react';
import { Competitor } from '../types';
interface StepReviewProps {
competitors: Competitor[];
competitors: Competitor[]; // Flattened list for overall count and manual management
categorizedCompetitors: {
localCompetitors: Competitor[];
nationalCompetitors: Competitor[];
internationalCompetitors: Competitor[];
} | null;
onRemove: (id: string) => void;
onAdd: (name: string) => void;
onConfirm: () => void;
@@ -12,7 +17,8 @@ interface StepReviewProps {
onShowReport?: () => void;
}
export const StepReview: React.FC<StepReviewProps> = ({ competitors, onRemove, onAdd, onConfirm, hasResults, onShowReport }) => {
export const StepReview: React.FC<StepReviewProps> = ({ competitors, categorizedCompetitors, onRemove, onAdd, onConfirm, hasResults, onShowReport }) => {
console.log("StepReview Props:", { competitors, categorizedCompetitors });
const [newCompany, setNewCompany] = useState('');
const handleAdd = (e: React.FormEvent) => {
@@ -23,6 +29,47 @@ export const StepReview: React.FC<StepReviewProps> = ({ competitors, onRemove, o
}
};
const renderCompetitorList = (comps: Competitor[], category: string) => {
if (!comps || comps.length === 0) {
return (
<li className="p-4 text-center text-slate-500 italic bg-white rounded-md border border-slate-100 mb-2 last:mb-0">
Keine {category} Konkurrenten gefunden.
</li>
);
}
return comps.map((comp) => (
<li key={comp.id} className="flex items-start justify-between p-4 hover:bg-slate-50 transition-colors group bg-white rounded-md border border-slate-100 mb-2 last:mb-0">
<div className="flex-1">
<div className="flex items-center gap-2">
<span className="font-bold text-slate-800 text-lg">{comp.name}</span>
{comp.url && (
<a
href={comp.url}
target="_blank"
rel="noreferrer"
className="text-indigo-500 hover:text-indigo-700 p-1 rounded hover:bg-indigo-50"
title={comp.url}
>
<ExternalLink size={14} />
</a>
)}
</div>
{comp.description && (
<p className="text-sm text-slate-500 mt-1 pr-8">{comp.description}</p>
)}
</div>
<button
onClick={() => onRemove(comp.id)}
className="text-slate-400 hover:text-red-500 p-2 rounded-full hover:bg-red-50 transition-colors opacity-0 group-hover:opacity-100 focus:opacity-100 self-center"
aria-label="Remove"
>
<Trash2 size={18} />
</button>
</li>
));
};
return (
<div className="max-w-4xl mx-auto mt-8 px-4 pb-24">
<div className="flex items-end justify-between mb-6">
@@ -37,63 +84,96 @@ export const StepReview: React.FC<StepReviewProps> = ({ competitors, onRemove, o
</div>
</div>
<div className="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
<ul className="divide-y divide-slate-100">
{competitors.map((comp) => (
<li key={comp.id} className="flex items-start justify-between p-4 hover:bg-slate-50 transition-colors group">
<div className="flex-1">
<div className="flex items-center gap-2">
<span className="font-bold text-slate-800 text-lg">{comp.name}</span>
{comp.url && (
<a
href={comp.url}
target="_blank"
rel="noreferrer"
className="text-indigo-500 hover:text-indigo-700 p-1 rounded hover:bg-indigo-50"
title={comp.url}
>
<ExternalLink size={14} />
</a>
)}
</div>
{comp.description && (
<p className="text-sm text-slate-500 mt-1 pr-8">{comp.description}</p>
)}
</div>
<button
onClick={() => onRemove(comp.id)}
className="text-slate-400 hover:text-red-500 p-2 rounded-full hover:bg-red-50 transition-colors opacity-0 group-hover:opacity-100 focus:opacity-100 self-center"
aria-label="Remove"
>
<Trash2 size={18} />
</button>
</li>
))}
{competitors.length === 0 && (
<li className="p-8 text-center text-slate-500 italic">
No companies in list. Add some manually below.
</li>
<div className="space-y-8">
{/* Local Competitors */}
<div className="bg-white rounded-xl shadow-sm border border-slate-200 p-6">
<h3 className="text-lg font-bold text-slate-800 mb-4 flex items-center gap-2">
<MapPin size={20} className="text-indigo-600" /> Lokale Konkurrenten
</h3>
<ul className="space-y-2">
{categorizedCompetitors?.localCompetitors && renderCompetitorList(categorizedCompetitors.localCompetitors, 'lokale')}
</ul>
</div>
{/* National Competitors */}
<div className="bg-white rounded-xl shadow-sm border border-slate-200 p-6">
<h3 className="text-lg font-bold text-slate-800 mb-4 flex items-center gap-2">
<Landmark size={20} className="text-indigo-600" /> Nationale Konkurrenten
</h3>
<ul className="space-y-2">
{categorizedCompetitors?.nationalCompetitors && renderCompetitorList(categorizedCompetitors.nationalCompetitors, 'nationale')}
</ul>
</div>
{/* International Competitors */}
<div className="bg-white rounded-xl shadow-sm border border-slate-200 p-6">
<h3 className="text-lg font-bold text-slate-800 mb-4 flex items-center gap-2">
<Globe size={20} className="text-indigo-600" /> Internationale Konkurrenten
</h3>
<ul className="space-y-2">
{categorizedCompetitors?.internationalCompetitors && renderCompetitorList(categorizedCompetitors.internationalCompetitors, 'internationale')}
</ul>
</div>
{/* Manual Additions */}
<div className="bg-white rounded-xl shadow-sm border border-slate-200 p-6">
<h3 className="text-lg font-bold text-slate-800 mb-4 flex items-center gap-2">
<Plus size={20} className="text-slate-600" /> Manuelle Ergänzungen
</h3>
<form onSubmit={handleAdd} className="flex gap-2">
<input
type="text"
value={newCompany}
onChange={(e) => setNewCompany(e.target.value)}
placeholder="Add another company manually..."
className="flex-1 px-4 py-2 rounded-lg border border-slate-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-500/20 outline-none"
/>
<button
type="submit"
disabled={!newCompany.trim()}
className="bg-white border border-slate-300 text-slate-700 hover:bg-slate-100 font-medium px-4 py-2 rounded-lg flex items-center gap-2 disabled:opacity-50"
>
<Plus size={18} /> Add
</button>
</form>
{competitors.length > 0 && (
<ul className="mt-4 space-y-2">
{competitors.filter(comp => !categorizedCompetitors?.localCompetitors?.some(c => c.id === comp.id) &&
!categorizedCompetitors?.nationalCompetitors?.some(c => c.id === comp.id) &&
!categorizedCompetitors?.internationalCompetitors?.some(c => c.id === comp.id))
.map((comp) => (
<li key={comp.id} className="flex items-start justify-between p-4 hover:bg-slate-50 transition-colors group bg-white rounded-md border border-slate-100">
<div className="flex-1">
<div className="flex items-center gap-2">
<span className="font-bold text-slate-800 text-lg">{comp.name}</span>
{comp.url && (
<a
href={comp.url}
target="_blank"
rel="noreferrer"
className="text-indigo-500 hover:text-indigo-700 p-1 rounded hover:bg-indigo-50"
title={comp.url}
>
<ExternalLink size={14} />
</a>
)}
</div>
{comp.description && (
<p className="text-sm text-slate-500 mt-1 pr-8">{comp.description}</p>
)}
</div>
<button
onClick={() => onRemove(comp.id)}
className="text-slate-400 hover:text-red-500 p-2 rounded-full hover:bg-red-50 transition-colors opacity-0 group-hover:opacity-100 focus:opacity-100 self-center"
aria-label="Remove"
>
<Trash2 size={18} />
</button>
</li>
))}
</ul>
)}
</ul>
<div className="bg-slate-50 p-4 border-t border-slate-200">
<form onSubmit={handleAdd} className="flex gap-2">
<input
type="text"
value={newCompany}
onChange={(e) => setNewCompany(e.target.value)}
placeholder="Add another company manually..."
className="flex-1 px-4 py-2 rounded-lg border border-slate-300 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-500/20 outline-none"
/>
<button
type="submit"
disabled={!newCompany.trim()}
className="bg-white border border-slate-300 text-slate-700 hover:bg-slate-100 font-medium px-4 py-2 rounded-lg flex items-center gap-2 disabled:opacity-50"
>
<Plus size={18} /> Add
</button>
</form>
</div>
</div>