Create src/components/grabber/AddSiteDialog.tsx

src/components/grabber/AddSiteDialog.tsx

@@ -0,0 +1,26 @@
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
+import { Input } from '@/components/ui/input';
+import { Button } from '@/components/ui/button';
+
+export function AddSiteDialog({ open, setOpen, onAdd }: any) {
+  const [form, setForm] = useState<any>({});
+
+  return (
+    <Dialog open={open} onOpenChange={(o) => setOpen(!o)}>
+      <DialogContent className="max-w-lg">
+        <DialogHeader><DialogTitle>Add Custom Site</DialogTitle></DialogHeader>
+        <div className="space-y-3 py-4">
+          <Input placeholder="Name" onChange={e => setForm({...form, name: e.target.value})} />
+          <Input placeholder="Base URL" onChange={e => setForm({...form, baseUrl: e.target.value})} />
+          <Input placeholder="Search Path (e.g. /posts.json)" onChange={e => setForm({...form, searchPath: e.target.value})} />
+          <Input placeholder="Posts JSON Path" onChange={e => setForm({...form, postsPath: e.target.value})} />
+          <div className="grid grid-cols-2 gap-2">
+            <Input placeholder="id field" onChange={e => setForm({...form, fields.id: e.target.value})} />
+            <Input placeholder="previewUrl field" onChange={e => setForm({...form, fields.previewUrl: e.target.value})} />
+          </div>
+        </div>
+        <Button onClick={() => { onAdd(form); setOpen(false); }} className="w-full">Save Site</Button>
+      </DialogContent>
+    </Dialog>
+  );
+}