TimoUttenweiler/lead-scraper
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: Entscheider-Kategorie als Einzelauswahl (Radio)

Browse Source 
- Nur noch eine Kategorie gleichzeitig wählbar (Array → einzelner Wert)
- ceo-Label: "CEO / Owner / President / Founder" mit Empfohlen-Badge
- API-Aufruf sendet [category] statt categories[]
- Überflüssige Validierungen entfernt

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Timo Uttenweiler
2026-03-17 13:05:14 +01:00
parent 717bc4f943
commit 39760b20a9
4 changed files with 61 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
app/airscale/page.tsx
View File

@@ -19,14 +19,12 @@ import { useAppStore } from "@/lib/store";
import type { DecisionMakerCategory } from "@/lib/services/anymailfinder"; import type { DecisionMakerCategory } from "@/lib/services/anymailfinder";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
const DEFAULT_ROLES: DecisionMakerCategory[] = ["ceo"]; const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string; recommended?: boolean }[] = [
{ value: "ceo", label: "CEO / Owner / President / Founder", recommended: true },
const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string }[] = [ { value: "operations", label: "COO" },
{ value: "ceo", label: "CEO / Inhaber / Gründer" }, { value: "engineering", label: "CTO" },
{ value: "operations", label: "COO / Geschäftsführung" }, { value: "marketing", label: "CMO" },
{ value: "engineering", label: "CTO / Technik" }, { value: "finance", label: "CFO" },
{ value: "marketing", label: "CMO / Marketing" },
{ value: "finance", label: "CFO / Finanzen" },
{ value: "sales", label: "Vertriebsleiter" }, { value: "sales", label: "Vertriebsleiter" },
]; ];
@@ -40,7 +38,7 @@ export default function AirScalePage() {
const [headers, setHeaders] = useState<string[]>([]); const [headers, setHeaders] = useState<string[]>([]);
const [domainCol, setDomainCol] = useState<string>(""); const [domainCol, setDomainCol] = useState<string>("");
const [nameCol, setNameCol] = useState<string>(""); const [nameCol, setNameCol] = useState<string>("");
const [categories, setCategories] = useState<DecisionMakerCategory[]>(DEFAULT_ROLES); const [category, setCategory] = useState<DecisionMakerCategory>("ceo");
const [jobId, setJobId] = useState<string | null>(null); const [jobId, setJobId] = useState<string | null>(null);
const [jobStatus, setJobStatus] = useState<string>("idle"); const [jobStatus, setJobStatus] = useState<string>("idle");
const [progress, setProgress] = useState({ current: 0, total: 0 }); const [progress, setProgress] = useState({ current: 0, total: 0 });
@@ -70,7 +68,6 @@ export default function AirScalePage() {
const startEnrichment = async () => { const startEnrichment = async () => {
if (!companies.length) return toast.error("Keine Unternehmen mit Domains gefunden"); if (!companies.length) return toast.error("Keine Unternehmen mit Domains gefunden");
if (!categories.length) return toast.error("Mindestens eine Entscheider-Kategorie auswählen");
setRunning(true); setRunning(true);
setResults([]); setResults([]);
@@ -80,7 +77,7 @@ export default function AirScalePage() {
const res = await fetch("/api/jobs/airscale-enrich", { const res = await fetch("/api/jobs/airscale-enrich", {
method: "POST", method: "POST",
headers: { "Content-Type": "application/json" }, headers: { "Content-Type": "application/json" },
body: JSON.stringify({ companies, categories }), body: JSON.stringify({ companies, categories: [category] }),
}); });
const data = await res.json() as { jobId?: string; error?: string }; const data = await res.json() as { jobId?: string; error?: string };
if (!res.ok || !data.jobId) throw new Error(data.error || "Failed to start job"); if (!res.ok || !data.jobId) throw new Error(data.error || "Failed to start job");
@@ -257,31 +254,24 @@ export default function AirScalePage() {
</h2> </h2>
<div className="space-y-3"> <div className="space-y-3">
<Label className="text-gray-300 text-sm">Kategorien auswählen (nach Priorität sortiert)</Label>
<div className="flex flex-wrap gap-2"> <div className="flex flex-wrap gap-2">
{CATEGORY_OPTIONS.map(opt => ( {CATEGORY_OPTIONS.map(opt => (
<button <button
key={opt.value} key={opt.value}
onClick={() => { onClick={() => setCategory(opt.value)}
setCategories(prev => className={`flex items-center gap-2 px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
prev.includes(opt.value) category === opt.value
? prev.filter(c => c !== opt.value)
: [...prev, opt.value]
);
}}
className={`px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
categories.includes(opt.value)
? "bg-blue-500/20 text-blue-300 border-blue-500/40" ? "bg-blue-500/20 text-blue-300 border-blue-500/40"
: "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-blue-500/30" : "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-blue-500/30"
}`} }`}
> >
{opt.label} {opt.label}
{opt.recommended && (
<span className="text-[10px] bg-blue-500/30 text-blue-300 px-1.5 py-0.5 rounded font-semibold">Empfohlen</span>
)}
</button> </button>
))} ))}
</div> </div>
<p className="text-xs text-gray-500">
Kategorien werden in Prioritätsreihenfolge durchsucht. Die erste Kategorie mit einem gültigen Ergebnis gewinnt.
</p>
</div> </div>
</Card> </Card>
@@ -302,7 +292,7 @@ export default function AirScalePage() {
) : ( ) : (
<Button <Button
onClick={startEnrichment} onClick={startEnrichment}
disabled={!withDomain || !domainCol || !categories.length} disabled={!withDomain || !domainCol}
className="bg-gradient-to-r from-blue-500 to-purple-600 hover:from-blue-600 hover:to-purple-700 text-white font-medium px-8 shadow-lg hover:shadow-blue-500/25 transition-all" className="bg-gradient-to-r from-blue-500 to-purple-600 hover:from-blue-600 hover:to-purple-700 text-white font-medium px-8 shadow-lg hover:shadow-blue-500/25 transition-all"
> >
Anreicherung starten ({withDomain} Unternehmen) Anreicherung starten ({withDomain} Unternehmen)

30
app/linkedin/page.tsx
View File

@@ -19,12 +19,12 @@ import { useAppStore } from "@/lib/store";
import type { DecisionMakerCategory } from "@/lib/services/anymailfinder"; import type { DecisionMakerCategory } from "@/lib/services/anymailfinder";
import type { ExportRow } from "@/lib/utils/csv"; import type { ExportRow } from "@/lib/utils/csv";
const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string }[] = [ const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string; recommended?: boolean }[] = [
{ value: "ceo", label: "CEO / Inhaber / Gründer" }, { value: "ceo", label: "CEO / Owner / President / Founder", recommended: true },
{ value: "operations", label: "COO / Geschäftsführung" }, { value: "operations", label: "COO" },
{ value: "engineering", label: "CTO / Technik" }, { value: "engineering", label: "CTO" },
{ value: "marketing", label: "CMO / Marketing" }, { value: "marketing", label: "CMO" },
{ value: "finance", label: "CFO / Finanzen" }, { value: "finance", label: "CFO" },
{ value: "sales", label: "Vertriebsleiter" }, { value: "sales", label: "Vertriebsleiter" },
]; ];
@@ -42,7 +42,7 @@ export default function LinkedInPage() {
const [enrichProgress, setEnrichProgress] = useState({ current: 0, total: 0 }); const [enrichProgress, setEnrichProgress] = useState({ current: 0, total: 0 });
const [results, setResults] = useState<ResultRow[]>([]); const [results, setResults] = useState<ResultRow[]>([]);
const [selectedIds, setSelectedIds] = useState<string[]>([]); const [selectedIds, setSelectedIds] = useState<string[]>([]);
const [categories, setCategories] = useState<DecisionMakerCategory[]>(["ceo"]); const [category, setCategory] = useState<DecisionMakerCategory>("ceo");
const { addJob, updateJob, removeJob } = useAppStore(); const { addJob, updateJob, removeJob } = useAppStore();
useEffect(() => { useEffect(() => {
@@ -115,7 +115,6 @@ export default function LinkedInPage() {
const startEnrich = async () => { const startEnrich = async () => {
if (!selectedIds.length) return toast.error("Mindestens ein Profil zum Anreichern auswählen"); if (!selectedIds.length) return toast.error("Mindestens ein Profil zum Anreichern auswählen");
if (!categories.length) return toast.error("Mindestens eine Kategorie auswählen");
setStage("enriching"); setStage("enriching");
setEnrichProgress({ current: 0, total: selectedIds.length }); setEnrichProgress({ current: 0, total: selectedIds.length });
@@ -124,7 +123,7 @@ export default function LinkedInPage() {
const res = await fetch("/api/jobs/linkedin-enrich", { const res = await fetch("/api/jobs/linkedin-enrich", {
method: "POST", method: "POST",
headers: { "Content-Type": "application/json" }, headers: { "Content-Type": "application/json" },
body: JSON.stringify({ jobId: scrapeJobId, resultIds: selectedIds, categories }), body: JSON.stringify({ jobId: scrapeJobId, resultIds: selectedIds, categories: [category] }),
}); });
const data = await res.json() as { jobId?: string; error?: string }; const data = await res.json() as { jobId?: string; error?: string };
if (!res.ok || !data.jobId) throw new Error(data.error || "Failed"); if (!res.ok || !data.jobId) throw new Error(data.error || "Failed");
@@ -355,16 +354,17 @@ export default function LinkedInPage() {
{CATEGORY_OPTIONS.map(opt => ( {CATEGORY_OPTIONS.map(opt => (
<button <button
key={opt.value} key={opt.value}
onClick={() => setCategories(prev => onClick={() => setCategory(opt.value)}
prev.includes(opt.value) ? prev.filter(c => c !== opt.value) : [...prev, opt.value] className={`flex items-center gap-2 px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
)} category === opt.value
className={`px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
categories.includes(opt.value)
? "bg-blue-500/20 text-blue-300 border-blue-500/40" ? "bg-blue-500/20 text-blue-300 border-blue-500/40"
: "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-blue-500/30" : "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-blue-500/30"
}`} }`}
> >
{opt.label} {opt.label}
{opt.recommended && (
<span className="text-[10px] bg-blue-500/30 text-blue-300 px-1.5 py-0.5 rounded font-semibold">Empfohlen</span>
)}
</button> </button>
))} ))}
</div> </div>
@@ -382,7 +382,7 @@ export default function LinkedInPage() {
{stage === "scraped" && ( {stage === "scraped" && (
<Button <Button
onClick={startEnrich} onClick={startEnrich}
disabled={!selectedIds.length || !categories.length} disabled={!selectedIds.length}
className="bg-gradient-to-r from-blue-500 to-purple-600 hover:from-blue-600 hover:to-purple-700 text-white font-medium px-8 shadow-lg hover:shadow-blue-500/25 transition-all" className="bg-gradient-to-r from-blue-500 to-purple-600 hover:from-blue-600 hover:to-purple-700 text-white font-medium px-8 shadow-lg hover:shadow-blue-500/25 transition-all"
> >
{selectedIds.length} ausgewählte Profile mit E-Mails anreichern {selectedIds.length} ausgewählte Profile mit E-Mails anreichern

32
app/maps/page.tsx
View File

@@ -17,12 +17,12 @@ import type { DecisionMakerCategory } from "@/lib/services/anymailfinder";
import type { ExportRow } from "@/lib/utils/csv"; import type { ExportRow } from "@/lib/utils/csv";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string }[] = [ const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string; recommended?: boolean }[] = [
{ value: "ceo", label: "CEO / Inhaber / Gründer" }, { value: "ceo", label: "CEO / Owner / President / Founder", recommended: true },
{ value: "operations", label: "COO / Geschäftsführung" }, { value: "operations", label: "COO" },
{ value: "engineering", label: "CTO / Technik" }, { value: "engineering", label: "CTO" },
{ value: "marketing", label: "CMO / Marketing" }, { value: "marketing", label: "CMO" },
{ value: "finance", label: "CFO / Finanzen" }, { value: "finance", label: "CFO" },
{ value: "sales", label: "Vertriebsleiter" }, { value: "sales", label: "Vertriebsleiter" },
]; ];
@@ -55,7 +55,7 @@ export default function MapsPage() {
const [regionInput, setRegionInput] = useState(""); const [regionInput, setRegionInput] = useState("");
const [maxResults, setMaxResults] = useState("60"); const [maxResults, setMaxResults] = useState("60");
const [enrichEmails, setEnrichEmails] = useState(true); const [enrichEmails, setEnrichEmails] = useState(true);
const [categories, setCategories] = useState<DecisionMakerCategory[]>(["ceo"]); const [category, setCategory] = useState<DecisionMakerCategory>("ceo");
const [stage, setStage] = useState<Stage>("idle"); const [stage, setStage] = useState<Stage>("idle");
const [jobId, setJobId] = useState<string | null>(null); const [jobId, setJobId] = useState<string | null>(null);
const [progress, setProgress] = useState({ current: 0, total: 0, phase: "" }); const [progress, setProgress] = useState({ current: 0, total: 0, phase: "" });
@@ -78,8 +78,7 @@ export default function MapsPage() {
const removeRegion = (r: string) => setRegions(prev => prev.filter(x => x !== r)); const removeRegion = (r: string) => setRegions(prev => prev.filter(x => x !== r));
const startJob = async () => { const startJob = async () => {
if (!keyword.trim()) return toast.error("Enter a search keyword"); if (!keyword.trim()) return toast.error("Suchbegriff eingeben");
if (!categories.length && enrichEmails) return toast.error("Select at least one email category");
setStage("running"); setStage("running");
setResults([]); setResults([]);
@@ -93,7 +92,7 @@ export default function MapsPage() {
queries, queries,
maxResultsPerQuery: Number(maxResults), maxResultsPerQuery: Number(maxResults),
languageCode: "de", languageCode: "de",
categories, categories: [category],
enrichEmails, enrichEmails,
}), }),
}); });
@@ -354,16 +353,17 @@ export default function MapsPage() {
{CATEGORY_OPTIONS.map(opt => ( {CATEGORY_OPTIONS.map(opt => (
<button <button
key={opt.value} key={opt.value}
onClick={() => setCategories(prev => onClick={() => setCategory(opt.value)}
prev.includes(opt.value) ? prev.filter(c => c !== opt.value) : [...prev, opt.value] className={`flex items-center gap-2 px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
)} category === opt.value
className={`px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
categories.includes(opt.value)
? "bg-green-500/20 text-green-300 border-green-500/40" ? "bg-green-500/20 text-green-300 border-green-500/40"
: "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-green-500/30" : "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-green-500/30"
}`} }`}
> >
{opt.label} {opt.label}
{opt.recommended && (
<span className="text-[10px] bg-green-500/30 text-green-300 px-1.5 py-0.5 rounded font-semibold">Empfohlen</span>
)}
</button> </button>
))} ))}
</div> </div>
@@ -380,7 +380,7 @@ export default function MapsPage() {
{stage === "idle" || stage === "failed" ? ( {stage === "idle" || stage === "failed" ? (
<Button <Button
onClick={startJob} onClick={startJob}
disabled={!keyword.trim() || (!categories.length && enrichEmails)} disabled={!keyword.trim()}
className="bg-gradient-to-r from-green-500 to-blue-600 hover:from-green-600 hover:to-blue-700 text-white font-medium px-8 shadow-lg hover:shadow-green-500/25 transition-all" className="bg-gradient-to-r from-green-500 to-blue-600 hover:from-green-600 hover:to-blue-700 text-white font-medium px-8 shadow-lg hover:shadow-green-500/25 transition-all"
> >
<MapPin className="w-4 h-4 mr-2" /> <MapPin className="w-4 h-4 mr-2" />

30
app/serp/page.tsx
View File

@@ -19,12 +19,12 @@ import { Checkbox } from "@/components/ui/checkbox";
const RESULT_OPTIONS = [10, 25, 50, 100, 200]; const RESULT_OPTIONS = [10, 25, 50, 100, 200];
const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string }[] = [ const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string; recommended?: boolean }[] = [
{ value: "ceo", label: "CEO / Inhaber / Gründer" }, { value: "ceo", label: "CEO / Owner / President / Founder", recommended: true },
{ value: "operations", label: "COO / Geschäftsführung" }, { value: "operations", label: "COO" },
{ value: "engineering", label: "CTO / Technik" }, { value: "engineering", label: "CTO" },
{ value: "marketing", label: "CMO / Marketing" }, { value: "marketing", label: "CMO" },
{ value: "finance", label: "CFO / Finanzen" }, { value: "finance", label: "CFO" },
{ value: "sales", label: "Vertriebsleiter" }, { value: "sales", label: "Vertriebsleiter" },
]; ];
@@ -36,7 +36,7 @@ export default function SerpPage() {
const [country, setCountry] = useState("de"); const [country, setCountry] = useState("de");
const [language, setLanguage] = useState("de"); const [language, setLanguage] = useState("de");
const [filterSocial, setFilterSocial] = useState(true); const [filterSocial, setFilterSocial] = useState(true);
const [categories, setCategories] = useState<DecisionMakerCategory[]>(["ceo"]); const [category, setCategory] = useState<DecisionMakerCategory>("ceo");
const [stage, setStage] = useState<Stage>("idle"); const [stage, setStage] = useState<Stage>("idle");
const [jobId, setJobId] = useState<string | null>(null); const [jobId, setJobId] = useState<string | null>(null);
const [progress, setProgress] = useState({ current: 0, total: 0, phase: "" }); const [progress, setProgress] = useState({ current: 0, total: 0, phase: "" });
@@ -48,7 +48,6 @@ export default function SerpPage() {
const startJob = async () => { const startJob = async () => {
if (!query.trim()) return toast.error("Suchbegriff eingeben"); if (!query.trim()) return toast.error("Suchbegriff eingeben");
if (!categories.length) return toast.error("Mindestens eine Kategorie auswählen");
setStage("running"); setStage("running");
setResults([]); setResults([]);
@@ -64,7 +63,7 @@ export default function SerpPage() {
countryCode: country, countryCode: country,
languageCode: language, languageCode: language,
filterSocial, filterSocial,
categories, categories: [category],
}), }),
}); });
const data = await res.json() as { jobId?: string; error?: string }; const data = await res.json() as { jobId?: string; error?: string };
@@ -249,16 +248,17 @@ export default function SerpPage() {
{CATEGORY_OPTIONS.map(opt => ( {CATEGORY_OPTIONS.map(opt => (
<button <button
key={opt.value} key={opt.value}
onClick={() => setCategories(prev => onClick={() => setCategory(opt.value)}
prev.includes(opt.value) ? prev.filter(c => c !== opt.value) : [...prev, opt.value] className={`flex items-center gap-2 px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
)} category === opt.value
className={`px-3 py-1.5 rounded-lg text-sm font-medium border transition-all ${
categories.includes(opt.value)
? "bg-purple-500/20 text-purple-300 border-purple-500/40" ? "bg-purple-500/20 text-purple-300 border-purple-500/40"
: "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-purple-500/30" : "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-purple-500/30"
}`} }`}
> >
{opt.label} {opt.label}
{opt.recommended && (
<span className="text-[10px] bg-purple-500/30 text-purple-300 px-1.5 py-0.5 rounded font-semibold">Empfohlen</span>
)}
</button> </button>
))} ))}
</div> </div>
@@ -274,7 +274,7 @@ export default function SerpPage() {
{stage === "idle" || stage === "failed" ? ( {stage === "idle" || stage === "failed" ? (
<Button <Button
onClick={startJob} onClick={startJob}
disabled={!query.trim() || !categories.length} disabled={!query.trim()}
className="bg-gradient-to-r from-purple-500 to-blue-600 hover:from-purple-600 hover:to-blue-700 text-white font-medium px-8 shadow-lg hover:shadow-purple-500/25 transition-all" className="bg-gradient-to-r from-purple-500 to-blue-600 hover:from-purple-600 hover:to-blue-700 text-white font-medium px-8 shadow-lg hover:shadow-purple-500/25 transition-all"
> >
SERP-Suche starten SERP-Suche starten