@harbinger-ai/harbinger 0.1.0

package/lib/chat/components/swarm-page.jsx

@@ -0,0 +1,210 @@
+'use client';
+
+import { useState, useEffect, useCallback } from 'react';
+import { PageLayout } from './page-layout.js';
+import { SpinnerIcon, RefreshIcon } from './icons.js';
+import { getSwarmStatus } from '../actions.js';
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Utilities
+// ─────────────────────────────────────────────────────────────────────────────
+
+function formatDuration(seconds) {
+  if (seconds < 60) return `${seconds}s`;
+  const minutes = Math.floor(seconds / 60);
+  const secs = seconds % 60;
+  if (minutes < 60) return `${minutes}m ${secs}s`;
+  const hours = Math.floor(minutes / 60);
+  const mins = minutes % 60;
+  return `${hours}h ${mins}m`;
+}
+
+function timeAgo(timestamp) {
+  const seconds = Math.floor((Date.now() - new Date(timestamp).getTime()) / 1000);
+  if (seconds < 60) return 'just now';
+  const minutes = Math.floor(seconds / 60);
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  if (days < 30) return `${days}d ago`;
+  const months = Math.floor(days / 30);
+  return `${months}mo ago`;
+}
+
+function LoadingSkeleton() {
+  return (
+    <div className="flex flex-col gap-4">
+      {[...Array(5)].map((_, i) => (
+        <div key={i} className="h-14 animate-pulse rounded-md bg-border/50" />
+      ))}
+    </div>
+  );
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Workflow List
+// ─────────────────────────────────────────────────────────────────────────────
+
+const conclusionBadgeStyles = {
+  success: 'bg-green-500/10 text-green-500',
+  failure: 'bg-red-500/10 text-red-500',
+  cancelled: 'bg-yellow-500/10 text-yellow-500',
+  skipped: 'bg-muted text-muted-foreground',
+};
+
+function SwarmWorkflowList({ runs }) {
+  if (!runs || runs.length === 0) {
+    return (
+      <div className="text-sm text-muted-foreground py-4 text-center">
+        No workflow runs.
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col divide-y divide-border">
+      {runs.map((run) => {
+        const isActive = run.status === 'in_progress' || run.status === 'queued';
+        const isRunning = run.status === 'in_progress';
+        const isQueued = run.status === 'queued';
+
+        return (
+          <a
+            key={run.run_id}
+            href={run.html_url}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex items-center gap-3 py-3 px-2 -mx-2 rounded-md hover:bg-accent transition-colors no-underline text-inherit"
+          >
+            {/* Status indicator */}
+            {isRunning && (
+              <span className="inline-block h-2.5 w-2.5 shrink-0 rounded-full bg-green-500 animate-pulse" />
+            )}
+            {isQueued && (
+              <span className="inline-block h-2.5 w-2.5 shrink-0 rounded-full bg-yellow-500" />
+            )}
+            {!isActive && (
+              <span
+                className={`inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium uppercase shrink-0 ${
+                  conclusionBadgeStyles[run.conclusion] || 'bg-muted text-muted-foreground'
+                }`}
+              >
+                {run.conclusion || 'unknown'}
+              </span>
+            )}
+
+            {/* Workflow name */}
+            <span className="text-sm font-medium truncate">
+              {run.workflow_name || run.branch}
+            </span>
+
+            {/* Duration or time ago */}
+            <span className="text-xs text-muted-foreground shrink-0">
+              {isActive
+                ? formatDuration(run.duration_seconds)
+                : timeAgo(run.updated_at || run.started_at)}
+            </span>
+
+            {/* Spacer */}
+            <div className="flex-1" />
+
+            {/* Link label */}
+            <span className="text-xs text-blue-500 shrink-0">
+              View
+            </span>
+          </a>
+        );
+      })}
+    </div>
+  );
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Main Page
+// ─────────────────────────────────────────────────────────────────────────────
+
+export function SwarmPage({ session }) {
+  const [runs, setRuns] = useState([]);
+  const [hasMore, setHasMore] = useState(false);
+  const [page, setPage] = useState(1);
+  const [loading, setLoading] = useState(true);
+  const [refreshing, setRefreshing] = useState(false);
+
+  const fetchPage = useCallback(async (p) => {
+    try {
+      const data = await getSwarmStatus(p);
+      setRuns(data.runs || []);
+      setHasMore(data.hasMore || false);
+      setPage(p);
+    } catch (err) {
+      console.error('Failed to fetch swarm status:', err);
+    } finally {
+      setLoading(false);
+      setRefreshing(false);
+    }
+  }, []);
+
+  // Initial load
+  useEffect(() => { fetchPage(1); }, [fetchPage]);
+
+  // Auto-refresh current page every 10s
+  useEffect(() => {
+    const interval = setInterval(() => fetchPage(page), 10000);
+    return () => clearInterval(interval);
+  }, [fetchPage, page]);
+
+  return (
+    <PageLayout session={session}>
+      {/* Header */}
+      <div className="flex items-center justify-between mb-6">
+        <h1 className="text-2xl font-semibold">Swarm</h1>
+        {!loading && (
+          <button
+            onClick={() => { setRefreshing(true); fetchPage(1); }}
+            disabled={refreshing}
+            className="inline-flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-xs font-medium border border-border bg-background text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:pointer-events-none"
+          >
+            {refreshing ? (
+              <>
+                <SpinnerIcon size={14} />
+                Refreshing...
+              </>
+            ) : (
+              <>
+                <RefreshIcon size={14} />
+                Refresh
+              </>
+            )}
+          </button>
+        )}
+      </div>
+
+      {loading ? (
+        <LoadingSkeleton />
+      ) : (
+        <div>
+          <SwarmWorkflowList runs={runs} />
+          {/* Pagination */}
+          <div className="flex items-center justify-between mt-4 pt-4 border-t border-border">
+            <button
+              onClick={() => { setRefreshing(true); fetchPage(page - 1); }}
+              disabled={page <= 1 || refreshing}
+              className="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium border border-border bg-background text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:pointer-events-none"
+            >
+              Previous
+            </button>
+            <span className="text-sm text-muted-foreground">Page {page}</span>
+            <button
+              onClick={() => { setRefreshing(true); fetchPage(page + 1); }}
+              disabled={!hasMore || refreshing}
+              className="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium border border-border bg-background text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:pointer-events-none"
+            >
+              Next
+            </button>
+          </div>
+        </div>
+      )}
+    </PageLayout>
+  );
+}

package/lib/chat/components/targets-page.js

@@ -0,0 +1,376 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { CrosshairIcon, PlusIcon, TrashIcon, ChevronDownIcon, GlobeIcon, SpinnerIcon, DownloadIcon, CheckIcon } from "./icons.js";
+import { getPrograms, createProgram, deleteProgram, getTargets, createTarget, deleteTarget, updateTarget, syncTargetsFromPlatform, syncAllTargets, getSyncStatus } from "../../bounty/actions.js";
+const PLATFORMS = [
+  { id: "hackerone", label: "HackerOne", color: "bg-purple-500/10 text-purple-500", border: "border-purple-500/20" },
+  { id: "bugcrowd", label: "Bugcrowd", color: "bg-orange-500/10 text-orange-500", border: "border-orange-500/20" },
+  { id: "intigriti", label: "Intigriti", color: "bg-blue-500/10 text-blue-500", border: "border-blue-500/20" },
+  { id: "yeswehack", label: "YesWeHack", color: "bg-teal-500/10 text-teal-500", border: "border-teal-500/20" },
+  { id: "federacy", label: "Federacy", color: "bg-pink-500/10 text-pink-500", border: "border-pink-500/20" },
+  { id: "custom", label: "Custom", color: "bg-muted text-muted-foreground", border: "border-border" }
+];
+const TARGET_TYPES = ["domain", "wildcard", "ip", "cidr", "url", "api", "mobile"];
+const STATUS_COLORS = {
+  in_scope: "bg-green-500/10 text-green-500",
+  out_of_scope: "bg-red-500/10 text-red-500",
+  testing: "bg-yellow-500/10 text-yellow-500",
+  completed: "bg-blue-500/10 text-blue-500"
+};
+function timeAgo(ts) {
+  if (!ts) return "never";
+  const diff = Date.now() - ts;
+  const mins = Math.floor(diff / 6e4);
+  if (mins < 60) return `${mins}m ago`;
+  const hrs = Math.floor(mins / 60);
+  if (hrs < 24) return `${hrs}h ago`;
+  return `${Math.floor(hrs / 24)}d ago`;
+}
+function SyncPanel({ onSync, syncStatus }) {
+  const [syncing, setSyncing] = useState(null);
+  const [results, setResults] = useState(null);
+  const [maxPrograms, setMaxPrograms] = useState("50");
+  async function handleSync(platform) {
+    setSyncing(platform);
+    setResults(null);
+    try {
+      const opts = { maxPrograms: parseInt(maxPrograms) || 0 };
+      let res;
+      if (platform === "all") {
+        res = await onSync(null, opts);
+      } else {
+        res = await onSync(platform, opts);
+      }
+      setResults(res);
+    } catch (err) {
+      setResults({ error: err.message });
+    }
+    setSyncing(null);
+  }
+  const syncablePlatforms = PLATFORMS.filter((p) => p.id !== "custom");
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4 mb-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h3", { className: "text-sm font-medium", children: "Sync from Bounty Platforms" }),
+        /* @__PURE__ */ jsx("p", { className: "text-[11px] text-muted-foreground mt-0.5", children: "Import programs and targets from bounty-targets-data (arkadiyt/bounty-targets-data)" })
+      ] }),
+      syncStatus?.lastSyncedAt && /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
+        "Last sync: ",
+        timeAgo(syncStatus.lastSyncedAt)
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2 mb-3", children: [
+      syncablePlatforms.map((p) => {
+        const count = syncStatus?.platformCounts?.[p.id] || 0;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => handleSync(p.id),
+            disabled: syncing !== null,
+            className: `inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-medium border transition-colors hover:bg-accent/50 disabled:opacity-50 ${p.border}`,
+            children: [
+              syncing === p.id ? /* @__PURE__ */ jsx(SpinnerIcon, { size: 12 }) : /* @__PURE__ */ jsx(DownloadIcon, { size: 12 }),
+              p.label,
+              count > 0 && /* @__PURE__ */ jsx("span", { className: `inline-flex rounded-full px-1.5 py-0.5 text-[9px] ${p.color}`, children: count })
+            ]
+          },
+          p.id
+        );
+      }),
+      /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: () => handleSync("all"),
+          disabled: syncing !== null,
+          className: "inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-medium bg-foreground text-background hover:opacity-90 disabled:opacity-50",
+          children: [
+            syncing === "all" ? /* @__PURE__ */ jsx(SpinnerIcon, { size: 12 }) : /* @__PURE__ */ jsx(DownloadIcon, { size: 12 }),
+            "Sync All"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-3", children: [
+      /* @__PURE__ */ jsx("label", { className: "text-[10px] text-muted-foreground", children: "Max programs per platform:" }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "number",
+          value: maxPrograms,
+          onChange: (e) => setMaxPrograms(e.target.value),
+          className: "w-20 text-xs border rounded-md px-2 py-1 bg-background",
+          min: "0",
+          placeholder: "0 = all"
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-[10px] text-muted-foreground", children: "(0 = unlimited)" })
+    ] }),
+    results && /* @__PURE__ */ jsx("div", { className: "rounded-md bg-muted/50 p-3 mt-2", children: results.error ? /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive", children: results.error }) : /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: Object.entries(results).map(([platform, stats]) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 text-xs", children: [
+      /* @__PURE__ */ jsx("span", { className: "font-medium w-24", children: platform }),
+      /* @__PURE__ */ jsxs("span", { className: "text-green-500", children: [
+        "+",
+        stats.programsAdded,
+        " programs"
+      ] }),
+      /* @__PURE__ */ jsxs("span", { className: "text-blue-500", children: [
+        stats.programsUpdated,
+        " updated"
+      ] }),
+      /* @__PURE__ */ jsxs("span", { className: "text-green-500", children: [
+        "+",
+        stats.targetsAdded,
+        " targets"
+      ] }),
+      /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
+        stats.targetsSkipped,
+        " skipped"
+      ] }),
+      stats.errors?.length > 0 && /* @__PURE__ */ jsxs("span", { className: "text-destructive", children: [
+        stats.errors.length,
+        " errors"
+      ] })
+    ] }, platform)) }) }),
+    syncStatus && syncStatus.totalSyncedPrograms > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 mt-2 pt-2 border-t", children: [
+      /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
+        syncStatus.totalSyncedPrograms,
+        " synced programs:"
+      ] }),
+      Object.entries(syncStatus.platformCounts || {}).map(([p, count]) => {
+        const plat = PLATFORMS.find((x) => x.id === p);
+        return /* @__PURE__ */ jsxs("span", { className: `inline-flex rounded-full px-2 py-0.5 text-[9px] font-medium ${plat?.color || ""}`, children: [
+          plat?.label || p,
+          " (",
+          count,
+          ")"
+        ] }, p);
+      })
+    ] })
+  ] });
+}
+function ProgramCard({ program, onSelect, selected, onDelete }) {
+  const platform = PLATFORMS.find((p) => p.id === program.platform) || PLATFORMS[5];
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      onClick: () => onSelect(program.id),
+      className: `flex items-center gap-3 w-full text-left p-3 rounded-lg border transition-colors ${selected ? "border-foreground bg-accent/50" : "bg-card hover:bg-accent/30"}`,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "shrink-0 rounded-md bg-muted p-2", children: /* @__PURE__ */ jsx(GlobeIcon, { size: 14 }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium truncate", children: program.name }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-0.5 flex-wrap", children: [
+            /* @__PURE__ */ jsx("span", { className: `inline-flex rounded-full px-2 py-0.5 text-[10px] font-medium ${platform.color}`, children: platform.label }),
+            program.maxBounty > 0 && /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-muted-foreground", children: [
+              "Up to $",
+              program.maxBounty.toLocaleString()
+            ] }),
+            program.syncHandle && /* @__PURE__ */ jsx("span", { className: "inline-flex rounded-full bg-cyan-500/10 px-1.5 py-0.5 text-[9px] text-cyan-500", children: "synced" })
+          ] })
+        ] }),
+        !program.syncHandle && /* @__PURE__ */ jsx("button", { onClick: (e) => {
+          e.stopPropagation();
+          onDelete(program.id);
+        }, className: "shrink-0 p-1 text-muted-foreground hover:text-destructive rounded", children: /* @__PURE__ */ jsx(TrashIcon, { size: 12 }) })
+      ]
+    }
+  );
+}
+function TargetRow({ target, onDelete, onStatusChange }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 p-3 rounded-lg border bg-card", children: [
+    /* @__PURE__ */ jsx("div", { className: "shrink-0 rounded-md bg-muted p-2", children: /* @__PURE__ */ jsx(CrosshairIcon, { size: 14 }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-sm font-mono font-medium truncate", children: target.value }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-0.5 flex-wrap", children: [
+        /* @__PURE__ */ jsx("span", { className: "inline-flex rounded-full bg-muted px-2 py-0.5 text-[10px] font-medium text-muted-foreground", children: target.type }),
+        target.syncSource && /* @__PURE__ */ jsx("span", { className: "inline-flex rounded-full bg-cyan-500/10 px-1.5 py-0.5 text-[9px] text-cyan-500", children: target.syncSource }),
+        target.technologies && /* @__PURE__ */ jsx("span", { className: "text-[10px] text-muted-foreground truncate", children: JSON.parse(target.technologies).join(", ") })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(
+      "select",
+      {
+        value: target.status,
+        onChange: (e) => onStatusChange(target.id, e.target.value),
+        className: `text-[10px] font-medium rounded-full px-2 py-0.5 border-0 cursor-pointer ${STATUS_COLORS[target.status] || ""}`,
+        children: [
+          /* @__PURE__ */ jsx("option", { value: "in_scope", children: "in scope" }),
+          /* @__PURE__ */ jsx("option", { value: "testing", children: "testing" }),
+          /* @__PURE__ */ jsx("option", { value: "completed", children: "completed" }),
+          /* @__PURE__ */ jsx("option", { value: "out_of_scope", children: "out of scope" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("button", { onClick: () => onDelete(target.id), className: "shrink-0 p-1 text-muted-foreground hover:text-destructive rounded", children: /* @__PURE__ */ jsx(TrashIcon, { size: 12 }) })
+  ] });
+}
+function AddForm({ fields, onSubmit }) {
+  const [values, setValues] = useState({});
+  const [open, setOpen] = useState(false);
+  if (!open) return /* @__PURE__ */ jsxs("button", { onClick: () => setOpen(true), className: "inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-medium border border-dashed hover:bg-accent/50 transition-colors text-muted-foreground hover:text-foreground", children: [
+    /* @__PURE__ */ jsx(PlusIcon, { size: 12 }),
+    " Add"
+  ] });
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-end gap-2 p-3 rounded-lg border bg-card", children: [
+    fields.map((f) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsx("label", { className: "text-[10px] text-muted-foreground", children: f.label }),
+      f.type === "select" ? /* @__PURE__ */ jsx("select", { value: values[f.name] || "", onChange: (e) => setValues({ ...values, [f.name]: e.target.value }), className: "text-xs border rounded-md px-2 py-1.5 bg-background", children: f.options.map((o) => /* @__PURE__ */ jsx("option", { value: o, children: o }, o)) }) : /* @__PURE__ */ jsx("input", { type: f.type || "text", placeholder: f.placeholder, value: values[f.name] || "", onChange: (e) => setValues({ ...values, [f.name]: e.target.value }), className: "text-xs border rounded-md px-2 py-1.5 bg-background min-w-[120px]" })
+    ] }, f.name)),
+    /* @__PURE__ */ jsx("button", { onClick: () => {
+      onSubmit(values);
+      setValues({});
+      setOpen(false);
+    }, className: "inline-flex items-center gap-1 rounded-md px-3 py-1.5 text-xs font-medium bg-foreground text-background hover:opacity-90", children: "Save" }),
+    /* @__PURE__ */ jsx("button", { onClick: () => {
+      setValues({});
+      setOpen(false);
+    }, className: "text-xs text-muted-foreground hover:text-foreground px-2 py-1.5", children: "Cancel" })
+  ] });
+}
+function TargetsPage() {
+  const [programs_, setPrograms] = useState([]);
+  const [targets_, setTargets] = useState([]);
+  const [selectedProgram, setSelectedProgram] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [syncStatus, setSyncStatus] = useState(null);
+  const [platformFilter, setPlatformFilter] = useState("all");
+  async function load() {
+    const [p, ss] = await Promise.all([getPrograms(), getSyncStatus()]);
+    setPrograms(p);
+    setSyncStatus(ss);
+    if (p.length > 0 && !selectedProgram) setSelectedProgram(p[0].id);
+    setLoading(false);
+  }
+  async function loadTargets() {
+    if (!selectedProgram) {
+      setTargets([]);
+      return;
+    }
+    const t = await getTargets(selectedProgram);
+    setTargets(t);
+  }
+  useEffect(() => {
+    load();
+  }, []);
+  useEffect(() => {
+    if (selectedProgram) loadTargets();
+  }, [selectedProgram]);
+  async function handleSync(platform, options) {
+    let res;
+    if (platform) {
+      const stats = await syncTargetsFromPlatform(platform, options);
+      res = { [platform]: stats };
+    } else {
+      res = await syncAllTargets(options);
+    }
+    await load();
+    if (selectedProgram) loadTargets();
+    return res;
+  }
+  async function handleAddProgram(values) {
+    await createProgram({ name: values.name || "Untitled", platform: values.platform || "custom", url: values.url, maxBounty: values.maxBounty ? Number(values.maxBounty) : null });
+    load();
+  }
+  async function handleDeleteProgram(id) {
+    await deleteProgram(id);
+    if (selectedProgram === id) setSelectedProgram(null);
+    load();
+  }
+  async function handleAddTarget(values) {
+    await createTarget({ programId: selectedProgram, type: values.type || "domain", value: values.value || "" });
+    loadTargets();
+  }
+  async function handleDeleteTarget(id) {
+    await deleteTarget(id);
+    loadTargets();
+  }
+  async function handleStatusChange(id, status) {
+    await updateTarget(id, { status });
+    loadTargets();
+  }
+  const filteredPrograms = platformFilter === "all" ? programs_ : programs_.filter((p) => p.platform === platformFilter);
+  if (loading) return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-3", children: [...Array(3)].map((_, i) => /* @__PURE__ */ jsx("div", { className: "h-16 animate-pulse rounded-lg bg-border/50" }, i)) });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-6", children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold", children: "Targets" }),
+      /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground mt-1", children: [
+        programs_.length,
+        " program",
+        programs_.length !== 1 ? "s" : "",
+        ", ",
+        targets_.length,
+        " target",
+        targets_.length !== 1 ? "s" : "",
+        " in scope"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(SyncPanel, { onSync: handleSync, syncStatus }),
+    /* @__PURE__ */ jsxs("div", { className: "flex gap-1 mb-4 overflow-x-auto pb-1", children: [
+      /* @__PURE__ */ jsxs("button", { onClick: () => setPlatformFilter("all"), className: `shrink-0 px-3 py-1 rounded-full text-xs font-medium transition-colors ${platformFilter === "all" ? "bg-foreground text-background" : "bg-muted text-muted-foreground hover:text-foreground"}`, children: [
+        "All (",
+        programs_.length,
+        ")"
+      ] }),
+      PLATFORMS.filter((p) => programs_.some((prog) => prog.platform === p.id)).map((p) => /* @__PURE__ */ jsxs("button", { onClick: () => setPlatformFilter(p.id), className: `shrink-0 px-3 py-1 rounded-full text-xs font-medium transition-colors ${platformFilter === p.id ? "bg-foreground text-background" : "bg-muted text-muted-foreground hover:text-foreground"}`, children: [
+        p.label,
+        " (",
+        programs_.filter((prog) => prog.platform === p.id).length,
+        ")"
+      ] }, p.id))
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-3 gap-6", children: [
+      /* @__PURE__ */ jsxs("div", { className: "lg:col-span-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+          /* @__PURE__ */ jsx("h2", { className: "text-sm font-medium", children: "Programs" }),
+          /* @__PURE__ */ jsx(
+            AddForm,
+            {
+              fields: [
+                { name: "name", label: "Name", placeholder: "Program name" },
+                { name: "platform", label: "Platform", type: "select", options: ["hackerone", "bugcrowd", "intigriti", "yeswehack", "federacy", "custom"] },
+                { name: "url", label: "URL", placeholder: "https://..." },
+                { name: "maxBounty", label: "Max Bounty", placeholder: "10000", type: "number" }
+              ],
+              onSubmit: handleAddProgram
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 max-h-[600px] overflow-y-auto", children: filteredPrograms.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center py-8 text-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "rounded-full bg-muted p-3 mb-3", children: /* @__PURE__ */ jsx(GlobeIcon, { size: 20 }) }),
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "No programs yet" }),
+          /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground mt-1", children: "Sync from platforms or add manually" })
+        ] }) : filteredPrograms.map((p) => /* @__PURE__ */ jsx(ProgramCard, { program: p, selected: selectedProgram === p.id, onSelect: setSelectedProgram, onDelete: handleDeleteProgram }, p.id)) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "lg:col-span-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+          /* @__PURE__ */ jsxs("h2", { className: "text-sm font-medium", children: [
+            "Targets ",
+            selectedProgram && `\u2014 ${programs_.find((p) => p.id === selectedProgram)?.name || ""}`
+          ] }),
+          selectedProgram && /* @__PURE__ */ jsx(
+            AddForm,
+            {
+              fields: [
+                { name: "value", label: "Target", placeholder: "*.example.com" },
+                { name: "type", label: "Type", type: "select", options: TARGET_TYPES }
+              ],
+              onSubmit: handleAddTarget
+            }
+          )
+        ] }),
+        !selectedProgram ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center py-12 text-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "rounded-full bg-muted p-4 mb-4", children: /* @__PURE__ */ jsx(CrosshairIcon, { size: 24 }) }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium mb-1", children: "Select a program" }),
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Choose a program to manage its targets" })
+        ] }) : targets_.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center py-12 text-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "rounded-full bg-muted p-4 mb-4", children: /* @__PURE__ */ jsx(CrosshairIcon, { size: 24 }) }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium mb-1", children: "No targets yet" }),
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Add domains, IPs, and URLs to start hunting" })
+        ] }) : /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 max-h-[600px] overflow-y-auto", children: targets_.map((t) => /* @__PURE__ */ jsx(TargetRow, { target: t, onDelete: handleDeleteTarget, onStatusChange: handleStatusChange }, t.id)) })
+      ] })
+    ] })
+  ] });
+}
+export {
+  TargetsPage
+};