mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-07-12 22:42:13 +02:00
d6fbbb97d4
- Added SidebarButtonBadge component to encapsulate badge styling and functionality. - Updated Sidebar to utilize SidebarButtonBadge for displaying new item notifications, enhancing visual clarity. - Adjusted SidebarUserProfile layout for better alignment in collapsed view.
47 lines
1.6 KiB
TypeScript
47 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import { Cable } from "lucide-react";
|
|
import { AgentSetupTabs } from "@/components/mcp/agent-setup-tabs";
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
DialogTrigger,
|
|
} from "@/components/ui/dialog";
|
|
import { BACKEND_URL } from "@/lib/env-config";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
/**
|
|
* Sidebar-footer button that opens the MCP setup guide: pick an agent
|
|
* (Claude Code, Codex, OpenCode, ...), copy its config, done.
|
|
*/
|
|
export function ConnectAgentDialog({ className }: { className?: string }) {
|
|
return (
|
|
<Dialog>
|
|
<DialogTrigger
|
|
className={cn(
|
|
"group/link relative flex h-9 items-center gap-2 rounded-md mx-2 px-2 text-sm text-left",
|
|
"transition-colors hover:bg-accent hover:text-accent-foreground",
|
|
"focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
|
|
className
|
|
)}
|
|
>
|
|
<Cable className="h-3.5 w-3.5 shrink-0" />
|
|
<span className="min-w-0 flex-1 truncate">Connect your agent</span>
|
|
</DialogTrigger>
|
|
<DialogContent className="max-h-[85vh] overflow-y-auto sm:max-w-2xl">
|
|
<DialogHeader>
|
|
<DialogTitle>Connect to Claude Code, Codex, OpenCode…</DialogTitle>
|
|
<DialogDescription>
|
|
The SurfSense MCP server gives any coding agent these scrapers and your knowledge base
|
|
as native tools. You need an API key (create one under API Keys) — then pick your agent
|
|
and paste its config.
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
<AgentSetupTabs options={{ baseUrl: BACKEND_URL || undefined }} />
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|