settings.tsx•10.2 kB
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Label } from "@/components/ui/label";
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Switch } from "@/components/ui/switch";
import AutonomousSettings from "@/components/settings/autonomous-settings";
export default function SettingsPage() {
return (
<div className="py-6">
<div className="max-w-7xl mx-auto px-4 sm:px-6 md:px-8">
<h1 className="text-2xl font-semibold text-neutral-900 mb-6">Settings</h1>
<Tabs defaultValue="general" className="w-full">
<TabsList className="mb-4">
<TabsTrigger value="general">General</TabsTrigger>
<TabsTrigger value="server">Server Settings</TabsTrigger>
<TabsTrigger value="network">Network</TabsTrigger>
<TabsTrigger value="advanced">Advanced</TabsTrigger>
</TabsList>
<TabsContent value="general">
<Card>
<CardHeader>
<CardTitle>General Settings</CardTitle>
<CardDescription>
Configure the general behavior of MCP Hub
</CardDescription>
</CardHeader>
<CardContent className="space-y-6">
<div className="space-y-2">
<Label htmlFor="app-name">Application Name</Label>
<Input id="app-name" defaultValue="MCP Hub" />
</div>
<div className="space-y-2">
<Label htmlFor="theme">Theme</Label>
<Select defaultValue="light">
<SelectTrigger id="theme">
<SelectValue placeholder="Select theme" />
</SelectTrigger>
<SelectContent>
<SelectItem value="light">Light</SelectItem>
<SelectItem value="dark">Dark</SelectItem>
<SelectItem value="system">System</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-2">
<Label htmlFor="language">Language</Label>
<Select defaultValue="en">
<SelectTrigger id="language">
<SelectValue placeholder="Select language" />
</SelectTrigger>
<SelectContent>
<SelectItem value="en">English</SelectItem>
<SelectItem value="es">Español</SelectItem>
<SelectItem value="fr">Français</SelectItem>
<SelectItem value="de">Deutsch</SelectItem>
<SelectItem value="ja">日本語</SelectItem>
</SelectContent>
</Select>
</div>
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label htmlFor="startup">Launch on Startup</Label>
<p className="text-sm text-muted-foreground">
Automatically start MCP Hub when your computer boots
</p>
</div>
<Switch id="startup" />
</div>
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label htmlFor="notifications">Notifications</Label>
<p className="text-sm text-muted-foreground">
Receive notifications about server events and status changes
</p>
</div>
<Switch id="notifications" defaultChecked />
</div>
<Button>Save Changes</Button>
</CardContent>
</Card>
</TabsContent>
<TabsContent value="server">
<Card>
<CardHeader>
<CardTitle>Server Settings</CardTitle>
<CardDescription>
Configure default settings for MCP servers
</CardDescription>
</CardHeader>
<CardContent className="space-y-6">
<div className="space-y-2">
<Label htmlFor="default-port">Default Port</Label>
<Input id="default-port" type="number" defaultValue="8080" />
</div>
<div className="space-y-2">
<Label htmlFor="server-timeout">Server Timeout (seconds)</Label>
<Input id="server-timeout" type="number" defaultValue="60" />
</div>
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label htmlFor="auto-restart">Auto Restart</Label>
<p className="text-sm text-muted-foreground">
Automatically restart servers if they crash
</p>
</div>
<Switch id="auto-restart" defaultChecked />
</div>
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label htmlFor="worker-default">Worker Mode by Default</Label>
<p className="text-sm text-muted-foreground">
Enable worker mode for new servers by default
</p>
</div>
<Switch id="worker-default" />
</div>
<Button>Save Changes</Button>
</CardContent>
</Card>
</TabsContent>
<TabsContent value="network">
<Card>
<CardHeader>
<CardTitle>Network Settings</CardTitle>
<CardDescription>
Configure network and connectivity settings
</CardDescription>
</CardHeader>
<CardContent className="space-y-6">
<div className="space-y-2">
<Label htmlFor="discovery-port">Service Discovery Port</Label>
<Input id="discovery-port" type="number" defaultValue="8081" />
</div>
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label htmlFor="auto-discovery">Automatic Server Discovery</Label>
<p className="text-sm text-muted-foreground">
Automatically discover MCP servers on your network
</p>
</div>
<Switch id="auto-discovery" defaultChecked />
</div>
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label htmlFor="remote-access">Remote Access</Label>
<p className="text-sm text-muted-foreground">
Allow MCP Hub to be accessed from other devices
</p>
</div>
<Switch id="remote-access" />
</div>
<Button>Save Changes</Button>
</CardContent>
</Card>
</TabsContent>
<TabsContent value="advanced">
{/* Autonomous Settings Component */}
<AutonomousSettings />
<Card>
<CardHeader>
<CardTitle>Advanced Settings</CardTitle>
<CardDescription>
Advanced configuration options for MCP Hub
</CardDescription>
</CardHeader>
<CardContent className="space-y-6">
<div className="space-y-2">
<Label htmlFor="log-level">Log Level</Label>
<Select defaultValue="info">
<SelectTrigger id="log-level">
<SelectValue placeholder="Select log level" />
</SelectTrigger>
<SelectContent>
<SelectItem value="debug">Debug</SelectItem>
<SelectItem value="info">Info</SelectItem>
<SelectItem value="warn">Warning</SelectItem>
<SelectItem value="error">Error</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-2">
<Label htmlFor="log-path">Log Path</Label>
<Input id="log-path" defaultValue="./logs" />
</div>
<div className="flex items-center justify-between">
<div className="space-y-0.5">
<Label htmlFor="debug-mode">Debug Mode</Label>
<p className="text-sm text-muted-foreground">
Enable additional debugging information
</p>
</div>
<Switch id="debug-mode" />
</div>
<div className="space-y-2">
<Label htmlFor="reset" className="text-destructive">Reset Application</Label>
<p className="text-sm text-muted-foreground">
Reset MCP Hub to its default settings. This action cannot be undone.
</p>
<Button variant="destructive">Reset MCP Hub</Button>
</div>
</CardContent>
</Card>
</TabsContent>
</Tabs>
</div>
</div>
);
}