2026-03-20 05:56:48 +00:00

99 lines
6.3 KiB
TypeScript

"use client";
import { motion } from 'framer-motion';
import { Save, Bell, Shield, Database, Cpu } from 'lucide-react';
export default function SettingsPage() {
return (
<div className="container mx-auto px-4 py-8">
<div className="flex justify-between items-end mb-8">
<div>
<h1 className="text-3xl font-bold font-mono tracking-tight mb-2">SYSTEM_<span className="text-primary">CONFIG</span></h1>
<p className="text-muted-foreground">Adjust core parameters, AI models, and notification routing.</p>
</div>
<button className="flex items-center gap-2 px-6 py-2 bg-primary hover:bg-primary/90 text-primary-foreground rounded font-mono text-sm font-bold shadow-[0_0_15px_rgba(0,255,136,0.3)] transition-all">
<Save className="w-4 h-4" /> COMMIT_CHANGES
</button>
</div>
<div className="grid md:grid-cols-3 gap-8">
<div className="md:col-span-2 space-y-6">
<motion.div initial={{opacity: 0}} animate={{opacity: 1}} className="p-6 bg-card border border-border rounded-lg">
<h2 className="text-lg font-bold font-mono mb-4 flex items-center gap-2 border-b border-border pb-2"><Cpu className="w-5 h-5 text-primary" /> AI_ENGINE_SETTINGS</h2>
<div className="grid grid-cols-2 gap-4">
<div>
<label className="block text-xs font-mono text-muted-foreground mb-1">Primary Provider</label>
<select className="w-full bg-background border border-border rounded px-3 py-2 text-sm focus:outline-none focus:border-primary">
<option>Anthropic (Claude 3.5 Sonnet)</option>
<option>OpenAI (GPT-4o)</option>
<option>Groq (Llama 3 70B)</option>
<option>Ollama (Local)</option>
</select>
</div>
<div>
<label className="block text-xs font-mono text-muted-foreground mb-1">Strictness Level</label>
<select className="w-full bg-background border border-border rounded px-3 py-2 text-sm focus:outline-none focus:border-primary">
<option>High (Miss deals, zero noise)</option>
<option selected>Balanced</option>
<option>Low (Catch everything, more noise)</option>
</select>
</div>
<div className="col-span-2">
<label className="block text-xs font-mono text-muted-foreground mb-1">API Key</label>
<input type="password" value="*************************" className="w-full bg-background border border-border rounded px-3 py-2 text-sm focus:outline-none focus:border-primary" readOnly/>
</div>
</div>
</motion.div>
<motion.div initial={{opacity: 0}} animate={{opacity: 1}} transition={{delay: 0.1}} className="p-6 bg-card border border-border rounded-lg">
<h2 className="text-lg font-bold font-mono mb-4 flex items-center gap-2 border-b border-border pb-2"><Bell className="w-5 h-5 text-accent" /> ALERT_ROUTING</h2>
<div className="space-y-4">
<div className="flex items-center justify-between p-3 bg-background border border-border rounded">
<div>
<div className="font-bold">Telegram Bot</div>
<div className="text-xs text-muted-foreground">Status: Connected (@BidWraithBot)</div>
</div>
<div className="w-10 h-5 bg-primary rounded-full relative cursor-pointer"><div className="absolute right-1 top-1 w-3 h-3 bg-primary-foreground rounded-full"></div></div>
</div>
<div className="flex items-center justify-between p-3 bg-background border border-border rounded">
<div>
<div className="font-bold">Discord Webhook</div>
<div className="text-xs text-muted-foreground">Status: Not Configured</div>
</div>
<div className="w-10 h-5 bg-border rounded-full relative cursor-pointer"><div className="absolute left-1 top-1 w-3 h-3 bg-muted-foreground rounded-full"></div></div>
</div>
</div>
</motion.div>
</div>
<div className="space-y-6">
<motion.div initial={{opacity: 0}} animate={{opacity: 1}} transition={{delay: 0.2}} className="p-6 bg-card border border-border rounded-lg">
<h2 className="text-lg font-bold font-mono mb-4 flex items-center gap-2 border-b border-border pb-2"><Shield className="w-5 h-5 text-muted-foreground" /> STEALTH_MODE</h2>
<div className="space-y-4">
<div>
<label className="block text-xs font-mono text-muted-foreground mb-1">Humanization Level</label>
<input type="range" min="1" max="100" defaultValue="75" className="w-full accent-primary" />
<div className="flex justify-between text-xs text-muted-foreground mt-1"><span>Fast/Bot</span><span>Slow/Human</span></div>
</div>
<div className="pt-2">
<label className="flex items-center gap-2 text-sm cursor-pointer">
<input type="checkbox" defaultChecked className="accent-primary w-4 h-4" /> Use Proxy Rotation
</label>
</div>
</div>
</motion.div>
<motion.div initial={{opacity: 0}} animate={{opacity: 1}} transition={{delay: 0.3}} className="p-6 bg-card border border-border rounded-lg">
<h2 className="text-lg font-bold font-mono mb-4 flex items-center gap-2 border-b border-border pb-2"><Database className="w-5 h-5 text-muted-foreground" /> DATA_MANAGEMENT</h2>
<div className="space-y-2">
<button className="w-full py-2 bg-background border border-border hover:border-primary text-sm font-mono rounded transition-colors text-left px-3">Export Database Backup</button>
<button className="w-full py-2 bg-background border border-border hover:border-primary text-sm font-mono rounded transition-colors text-left px-3">Clear Old Logs (&gt;30d)</button>
<button className="w-full py-2 bg-destructive/10 border border-destructive/30 text-destructive hover:bg-destructive hover:text-destructive-foreground text-sm font-mono rounded transition-colors text-left px-3 mt-4">FACTORY RESET</button>
</div>
</motion.div>
</div>
</div>
</div>
);
}