refactor: Entscheider-Kategorie als Einzelauswahl (Radio)
- 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:
@@ -19,12 +19,12 @@ import { Checkbox } from "@/components/ui/checkbox";
|
||||
|
||||
const RESULT_OPTIONS = [10, 25, 50, 100, 200];
|
||||
|
||||
const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string }[] = [
|
||||
{ value: "ceo", label: "CEO / Inhaber / Gründer" },
|
||||
{ value: "operations", label: "COO / Geschäftsführung" },
|
||||
{ value: "engineering", label: "CTO / Technik" },
|
||||
{ value: "marketing", label: "CMO / Marketing" },
|
||||
{ value: "finance", label: "CFO / Finanzen" },
|
||||
const CATEGORY_OPTIONS: { value: DecisionMakerCategory; label: string; recommended?: boolean }[] = [
|
||||
{ value: "ceo", label: "CEO / Owner / President / Founder", recommended: true },
|
||||
{ value: "operations", label: "COO" },
|
||||
{ value: "engineering", label: "CTO" },
|
||||
{ value: "marketing", label: "CMO" },
|
||||
{ value: "finance", label: "CFO" },
|
||||
{ value: "sales", label: "Vertriebsleiter" },
|
||||
];
|
||||
|
||||
@@ -36,7 +36,7 @@ export default function SerpPage() {
|
||||
const [country, setCountry] = useState("de");
|
||||
const [language, setLanguage] = useState("de");
|
||||
const [filterSocial, setFilterSocial] = useState(true);
|
||||
const [categories, setCategories] = useState<DecisionMakerCategory[]>(["ceo"]);
|
||||
const [category, setCategory] = useState<DecisionMakerCategory>("ceo");
|
||||
const [stage, setStage] = useState<Stage>("idle");
|
||||
const [jobId, setJobId] = useState<string | null>(null);
|
||||
const [progress, setProgress] = useState({ current: 0, total: 0, phase: "" });
|
||||
@@ -48,7 +48,6 @@ export default function SerpPage() {
|
||||
|
||||
const startJob = async () => {
|
||||
if (!query.trim()) return toast.error("Suchbegriff eingeben");
|
||||
if (!categories.length) return toast.error("Mindestens eine Kategorie auswählen");
|
||||
|
||||
setStage("running");
|
||||
setResults([]);
|
||||
@@ -64,7 +63,7 @@ export default function SerpPage() {
|
||||
countryCode: country,
|
||||
languageCode: language,
|
||||
filterSocial,
|
||||
categories,
|
||||
categories: [category],
|
||||
}),
|
||||
});
|
||||
const data = await res.json() as { jobId?: string; error?: string };
|
||||
@@ -249,16 +248,17 @@ export default function SerpPage() {
|
||||
{CATEGORY_OPTIONS.map(opt => (
|
||||
<button
|
||||
key={opt.value}
|
||||
onClick={() => setCategories(prev =>
|
||||
prev.includes(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)
|
||||
onClick={() => setCategory(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
|
||||
? "bg-purple-500/20 text-purple-300 border-purple-500/40"
|
||||
: "bg-[#0d0d18] text-gray-400 border-[#2e2e3e] hover:border-purple-500/30"
|
||||
}`}
|
||||
>
|
||||
{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>
|
||||
))}
|
||||
</div>
|
||||
@@ -274,7 +274,7 @@ export default function SerpPage() {
|
||||
{stage === "idle" || stage === "failed" ? (
|
||||
<Button
|
||||
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"
|
||||
>
|
||||
SERP-Suche starten
|
||||
|
||||
Reference in New Issue
Block a user