diff --git a/src/admin/UserCreatePage.tsx b/src/admin/UserCreatePage.tsx index 2e6cbad62..9c8cbc59b 100644 --- a/src/admin/UserCreatePage.tsx +++ b/src/admin/UserCreatePage.tsx @@ -4,6 +4,7 @@ import { Button } from "@/components/ui/button"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { useNavigate } from "react-router-dom"; import { useAuth } from "@/context/AuthContext"; +import { useToast } from "@/components/ui/use-toast"; const apiBase = import.meta.env.VITE_API_URL; @@ -14,8 +15,11 @@ const UserCreatePage = () => { const [email, setEmail] = useState(""); const { token } = useAuth(); -const {isAuthenticated, isAdmin} = useAuth(); -const navigate = useNavigate(); + const {isAuthenticated, isAdmin} = useAuth(); + const navigate = useNavigate(); + + const {toast} = useToast(); + const [isLoading, setIsLoading] = useState(false); useEffect(() => { if(!isAuthenticated || !isAdmin) { @@ -25,28 +29,42 @@ useEffect(() => { - const handleSubmit = async (e: React.FormEvent) => { - e.preventDefault(); - try { - const res = await fetch(`${apiBase}/api/users`, { - method: "POST", - headers: { - "Content-Type": "application/json", - Authorization: `Bearer ${token}`, - }, - body: JSON.stringify({ username, password, role, email }), - }); +const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setIsLoading(true); + try { + const res = await fetch(`${apiBase}/api/users`, { + method: "POST", + headers: { + "Content-Type": "application/json", + Authorization: `Bearer ${token}`, + }, + body: JSON.stringify({ username, password, role, email }), + }); - if (!res.ok) { - throw new Error("Fehler beim Anlegen des Benutzers"); - } - - navigate("/admin/users"); - } catch (err) { - console.error(err); - alert("Benutzer konnte nicht angelegt werden"); + if (!res.ok) { + throw new Error("Fehler beim Anlegen des Benutzers"); } - }; + + toast({ + title: "Benutzer erstellt", + description: `Der Benutzer "${username}" wurde erfolgreich angelegt.`, + variant: "default", + }); + + navigate("/admin/users"); + } catch (err) { + console.error(err); + toast({ + title: "Fehler", + description: "Benutzer konnte nicht angelegt werden.", + variant: "destructive", + }); + } finally { + setIsLoading(false); + } +}; + return (
@@ -84,8 +102,12 @@ useEffect(() => { - diff --git a/tg-volleyball-frontend-todo.md b/tg-volleyball-frontend-todo.md new file mode 100644 index 000000000..7624adf4e --- /dev/null +++ b/tg-volleyball-frontend-todo.md @@ -0,0 +1,83 @@ + +# 🏐 TG Volleyball Frontend – ToDo Liste + +## 🧱 Grundstruktur & Technik +- [x] Projekt mit Vite + React + TypeScript + Tailwind erstellt +- [x] shadcn-ui integriert +- [x] Routing mit React Router v7 eingerichtet +- [x] `.env`-System für API-URL + +## 🎨 Landing Page +- [ ] Teambereich mit Bildern & Beschreibung +- [ ] News-Bereich mit Vorschau aktueller News +- [ ] Events/Trainingszeiten-Bereich +- [ ] Login-Link zum internen Bereich +- [ ] Footer mit Impressum / Datenschutz / Kontakt +- [ ] Komponenten mit DB verknüpfen für dynamische Anzeige + +## 📢 NewsManager (Admin) +- [x] News anzeigen (Grid) +- [x] News erstellen +- [x] News bearbeiten +- [x] News löschen +- [x] Modal zur Löschbestätigung +- [x] Form mit Bild, Titel, Beschreibung, Team +- [x] Toast für Erfolg & Fehler +- [x] Ladeindikator beim Speichern +- [ ] Bildvorschau für `image_url` + +## 👤 Userverwaltung (Admin) +- [x] User anlegen mit Rolle und Email +- [ ] Userliste anzeigen +- [ ] User bearbeiten +- [ ] User löschen +- [x] Zugriffsbeschränkung: Nur Admins +- [ ] Passwort zurücksetzen per UI +- [ ] Toasts für alle Aktionen + +## 🔐 Authentifizierung +- [x] Login mit Username & Passwort +- [ ] AuthContext mit Token-Handling +- [ ] Automatischer Logout nach Token-Ablauf +- [ ] Persistenter Login (LocalStorage) +- [ ] Fehlerbehandlung beim Login (Toast) +- [ ] Bugfix: Login funktioniert erst nach `/admin`-Redirect + +## 🧩 Medien & Nextcloud (Zukunft 💡) +- [ ] Nextcloud-Medienintegration vorbereiten +- [ ] Streaming/Browsing über öffentlichen Link oder WebDAV +- [ ] Media-Browser-Komponente +- [ ] Galerie über Datenbank abbilden + +## 📬 Kommunikation & Tools +- [ ] Newsletter-Anbindung +- [ ] Mailfunktion an Trainer bei Team-Anmeldung +- [ ] SMS/Weiterleitung an Handynummer +- [ ] Integration Spond je Team (API) + +## 📦 Teams & Spieler +- [ ] Admin kann Teams bearbeiten +- [ ] Spieler mit Bild anlegen (DB) +- [ ] Live-Ticker-Anbindung an NVV Sams (API Keys notwendig) + +## ⚙️ UX & Styling +- [x] Buttons & Forms mit shadcn-ui stylen +- [x] Frog-Farben & Branding integriert 🐸 +- [ ] Dark Mode optional? +- [ ] Animierte Ladezustände (Spinner) +- [ ] Navbar Dropdowns funktionieren nicht korrekt (Bug) +- [ ] Navbar-Menüpunkte umbrechen bei wenig Platz → Schrift kleiner machen + +## 📱 Mobile & Responsive +- [ ] Mobile Ansicht planen & umsetzen (Zukunft) + +## 🧪 Testing & Dev Stuff +- [ ] API-Mock-Option für Offline-Entwicklung +- [ ] Unit Tests mit `vitest` (optional) +- [ ] Komponentenstruktur refactoren (wenn groß) +- [ ] `useApi()`-Hook für zentrale API-Calls + + +## Infra +- [ ] Deployment über GiTea einrichten +- [ ] Webserver installieren