0c47dce508
The frontend was built against HeroUI v2 props/classes (variant="light"/"flat", color="primary", startContent, text-tiny, <Avatar src=/name=>) while @heroui/react ^3.2.1 is installed, so most styling was silently ignored. Rewrites every page/component onto the actual v3 API (variant/color enums, Tooltip/Dropdown trigger-content structure, Avatar.Image/Fallback via a new AppAvatar helper) and replaces the custom orange branding with HeroUI's neutral default theme tokens. Also compacts the dashboard stat tiles, narrows the sidebar, and swaps the activity stat grid for a single-hue comparison bar chart. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
88 lines
4.3 KiB
TypeScript
88 lines
4.3 KiB
TypeScript
import { Card, CardContent, CardHeader, Input, Button, Switch, Separator, TextField, Label } from '@heroui/react';
|
|
import { Settings, Save, Logs, Bell, Shield, Edit3, Trash2 } from 'lucide-react';
|
|
import { useApp } from '../context/AppContext';
|
|
import { SectionCard } from '../components/shared/SectionCard';
|
|
|
|
export function SettingsPage() {
|
|
const { settings, setSettings, saveSettingsPayload } = useApp();
|
|
|
|
return (
|
|
<SectionCard title="Einstellungen & Logging" subtitle="Globale Guild-Settings und Log-Kategorien">
|
|
<div className="grid gap-5 xl:grid-cols-2">
|
|
<Card>
|
|
<CardHeader className="px-5 pt-5 pb-0">
|
|
<h3 className="text-base font-semibold">Allgemein</h3>
|
|
</CardHeader>
|
|
<CardContent className="flex flex-col gap-4 p-5">
|
|
<TextField>
|
|
<Label>Welcome Channel ID</Label>
|
|
<Input
|
|
placeholder="Channel ID"
|
|
value={settings.welcomeChannelId || ''}
|
|
onChange={(e) => setSettings((s) => ({ ...s, welcomeChannelId: e.target.value }))}
|
|
/>
|
|
</TextField>
|
|
|
|
<TextField>
|
|
<Label>Log Channel ID</Label>
|
|
<Input
|
|
placeholder="Channel ID"
|
|
value={settings.logChannelId || ''}
|
|
onChange={(e) => setSettings((s) => ({ ...s, logChannelId: e.target.value }))}
|
|
/>
|
|
</TextField>
|
|
|
|
<TextField>
|
|
<Label>Support Role ID</Label>
|
|
<Input
|
|
placeholder="Role ID"
|
|
value={settings.supportRoleId || ''}
|
|
onChange={(e) => setSettings((s) => ({ ...s, supportRoleId: e.target.value }))}
|
|
/>
|
|
</TextField>
|
|
|
|
<Separator />
|
|
|
|
<Button variant="primary" onPress={() => saveSettingsPayload(settings, 'Settings gespeichert')}>
|
|
<Save size={16} /> Speichern
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card>
|
|
<CardHeader className="px-5 pt-5 pb-0">
|
|
<h3 className="text-base font-semibold">Logging Kategorien</h3>
|
|
</CardHeader>
|
|
<CardContent className="flex flex-col gap-4 p-5">
|
|
<Switch isSelected={settings.loggingConfig?.categories?.joinLeave !== false} onChange={(v) => setSettings((s) => ({ ...s, loggingConfig: { ...(s.loggingConfig || {}), categories: { ...(s.loggingConfig?.categories || {}), joinLeave: v } } }))}>
|
|
<div className="flex items-center gap-2"><Logs size={14} /> Join / Leave loggen</div>
|
|
</Switch>
|
|
|
|
<Switch isSelected={settings.loggingConfig?.categories?.messageEdit !== false} onChange={(v) => setSettings((s) => ({ ...s, loggingConfig: { ...(s.loggingConfig || {}), categories: { ...(s.loggingConfig?.categories || {}), messageEdit: v } } }))}>
|
|
<div className="flex items-center gap-2"><Edit3 size={14} /> Message Edit loggen</div>
|
|
</Switch>
|
|
|
|
<Switch isSelected={settings.loggingConfig?.categories?.messageDelete !== false} onChange={(v) => setSettings((s) => ({ ...s, loggingConfig: { ...(s.loggingConfig || {}), categories: { ...(s.loggingConfig?.categories || {}), messageDelete: v } } }))}>
|
|
<div className="flex items-center gap-2"><Trash2 size={14} /> Message Delete loggen</div>
|
|
</Switch>
|
|
|
|
<Switch isSelected={settings.loggingConfig?.categories?.automodActions !== false} onChange={(v) => setSettings((s) => ({ ...s, loggingConfig: { ...(s.loggingConfig || {}), categories: { ...(s.loggingConfig?.categories || {}), automodActions: v } } }))}>
|
|
<div className="flex items-center gap-2"><Shield size={14} /> Automod Actions loggen</div>
|
|
</Switch>
|
|
|
|
<Switch isSelected={settings.loggingConfig?.categories?.ticketActions !== false} onChange={(v) => setSettings((s) => ({ ...s, loggingConfig: { ...(s.loggingConfig || {}), categories: { ...(s.loggingConfig?.categories || {}), ticketActions: v } } }))}>
|
|
<div className="flex items-center gap-2"><Bell size={14} /> Ticket Actions loggen</div>
|
|
</Switch>
|
|
|
|
<Separator />
|
|
|
|
<Button variant="primary" onPress={() => saveSettingsPayload(settings, 'Settings gespeichert')}>
|
|
<Save size={16} /> Speichern
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</SectionCard>
|
|
);
|
|
}
|