Pepe44DEV/Papo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simplify heroui layouts and add sonarqube workflow
Some checks failed
Deploy Discord Bot / deploy (push) Has been cancelled
Details
SonarQube / sonar (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Pepe44DEV
2026-07-01 15:46:04 +02:00
parent da72f49255
commit a604fb494f
10 changed files with 237 additions and 227 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
frontend/src/pages/SupportLogin.tsx
View File

@@ -1,5 +1,5 @@
import { Card, CardContent, CardHeader, Input, TextArea, Button, Chip, Switch, Separator, TextField, Label } from '@heroui/react';
import { LogIn, UserRound, Eye, Save, Send, RefreshCw } from 'lucide-react';
import { Avatar, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, TextArea, Button, Chip, Switch, Separator, TextField, Label } from '@heroui/react';
import { LogIn, UserRound, Save, Send } from 'lucide-react';
import { useApp } from '../context/AppContext';
import { SectionCard } from '../components/shared/SectionCard';
@@ -7,13 +7,16 @@ export function SupportLogin() {
const { supportLogin, setSupportLogin, saveSupportLogin } = useApp();
return (
<SectionCard title="Support Login" subtitle="Login-Panel f<EFBFBD>r Supporter konfigurieren">
<SectionCard title="Support Login" subtitle="Login-Panel fuer Supporter konfigurieren">
<div className="grid gap-5 xl:grid-cols-[1fr_400px]">
<Card className="border border-default-100 bg-default-50/20">
<CardHeader className="px-5 pt-5 pb-0">
<h3 className="text-base font-semibold">Panel-Konfiguration</h3>
<Card>
<CardHeader>
<div>
<CardTitle>Panel-Konfiguration</CardTitle>
<CardDescription>Texte und Zielkanal mit normalen HeroUI-Feldern pflegen.</CardDescription>
</div>
</CardHeader>
<CardContent className="flex flex-col gap-4 p-5">
<CardContent className="flex flex-col gap-4">
<Switch
isSelected={supportLogin?.config?.autoRefresh !== false}
onChange={(v) => setSupportLogin((s) => s ? { ...s, config: { ...s.config, autoRefresh: v } } : s)}
@@ -76,41 +79,48 @@ export function SupportLogin() {
</Card>
<div className="space-y-4">
<Card className="border border-default-100 bg-default-50/20">
<CardHeader className="px-5 pt-5 pb-0">
<h3 className="text-base font-semibold">Live Vorschau</h3>
<Card>
<CardHeader>
<div>
<CardTitle>Live Vorschau</CardTitle>
<CardDescription>Panel in einer normalen HeroUI-Karte.</CardDescription>
</div>
</CardHeader>
<CardContent className="p-5">
<div className="rounded-xl border border-default-100 bg-gradient-to-b from-default-50/40 to-background p-4">
<div className="flex items-center gap-3 mb-3">
<div className="flex size-10 items-center justify-center rounded-xl bg-primary-500/10 text-primary-400">
<LogIn size={20} />
<CardContent>
<Card>
<CardHeader>
<div className="flex items-center gap-2">
<LogIn size={16} />
<div>
<CardTitle>{supportLogin?.config?.title || 'Support Login'}</CardTitle>
<CardDescription>{supportLogin?.config?.description || 'Melde dich als Support an/ab.'}</CardDescription>
</div>
</div>
<div>
<div className="font-semibold">{supportLogin?.config?.title || 'Support Login'}</div>
<div className="text-tiny text-default-400">{supportLogin?.config?.description || 'Melde dich als Support an/ab.'}</div>
</div>
</div>
<div className="flex gap-2">
</CardHeader>
<CardContent className="flex gap-2">
<Button size="sm" color="primary" variant="flat">{supportLogin?.config?.loginLabel || 'Login'}</Button>
<Button size="sm" variant="flat">{supportLogin?.config?.logoutLabel || 'Logout'}</Button>
</div>
</div>
</CardContent>
</Card>
</CardContent>
</Card>
<Card className="border border-default-100 bg-default-50/20">
<CardHeader className="px-5 pt-5 pb-0">
<h3 className="text-base font-semibold">Aktive Supporter</h3>
<Card>
<CardHeader>
<div>
<CardTitle>Aktive Supporter</CardTitle>
<CardDescription>Aktueller Status aus der Guild.</CardDescription>
</div>
</CardHeader>
<CardContent className="flex flex-col gap-2 p-5">
<CardContent className="flex flex-col gap-2">
{supportLogin?.status?.active?.length ? supportLogin.status.active.map((s, i) => (
<div key={i} className="flex items-center gap-3 rounded-xl border border-default-100 bg-default-50/30 px-4 py-3 text-small">
<div className="size-2 rounded-full bg-success-400" />
<Avatar name={s.username?.[0]} size="sm" className="size-6" />
<span className="font-medium">{s.username || s.userId}</span>
<Chip size="sm" variant="flat" color="success" className="ml-auto">Online</Chip>
</div>
<Card key={i}>
<CardContent className="flex items-center gap-3">
<Avatar name={s.username?.[0]} size="sm" className="size-6" />
<span className="font-medium">{s.username || s.userId}</span>
<Chip size="sm" variant="flat" color="success" className="ml-auto">Online</Chip>
</CardContent>
</Card>
)) : (
<div className="flex flex-col items-center gap-2 py-4 text-center text-tiny text-default-400">
<UserRound size={20} />