40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
import { Menu, Settings } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
const Sidebar = ({ connectionStatus }: { connectionStatus: string }) => (
|
|
<div className="w-64 bg-white border-r border-gray-200">
|
|
<div className="flex items-center p-4 border-b border-gray-200">
|
|
<Menu className="w-6 h-6 text-gray-500" />
|
|
<h1 className="ml-2 text-lg font-semibold">MCP Inspector</h1>
|
|
</div>
|
|
|
|
<div className="p-4">
|
|
<div className="flex items-center space-x-2 mb-4">
|
|
<div
|
|
className={`w-2 h-2 rounded-full ${
|
|
connectionStatus === "connected"
|
|
? "bg-green-500"
|
|
: connectionStatus === "error"
|
|
? "bg-red-500"
|
|
: "bg-gray-500"
|
|
}`}
|
|
/>
|
|
<span className="text-sm text-gray-600">
|
|
{connectionStatus === "connected"
|
|
? "Connected"
|
|
: connectionStatus === "error"
|
|
? "Connection Error"
|
|
: "Disconnected"}
|
|
</span>
|
|
</div>
|
|
|
|
<Button variant="outline" className="w-full justify-start">
|
|
<Settings className="w-4 h-4 mr-2" />
|
|
Connection Settings
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
export default Sidebar;
|