Major Frontend Refactoring: - Replace ImagePreviewGallery with unified ImageGallery/ImageGalleryCard components - Support 4 display modes: group, moderation, preview, single-image - Add hidePreview prop to conditionally hide group preview images - Unified grid layout with responsive 3/2/1 column design - Remove 15+ legacy files and components - Delete UploadedImagePage, SocialMedia components, old upload components - Remove unused CSS files (GroupCard.css, Image.css/scss) - Clean up /upload/:image_url route from App.js - Fix image preview functionality in MultiUploadPage - Convert File objects to blob URLs with URL.createObjectURL() - Add proper memory cleanup with URL.revokeObjectURL() - Improve page navigation and layout - Fix GroupsOverviewPage to route to /groups/:groupId detail page - Adjust PublicGroupImagesPage spacing and layout - Fix ModerationGroupsPage duplicate stats section CSS Refactoring: - Rename GroupCard.css → ImageGallery.css with updated class names - Maintain backward compatibility with legacy class names - Fix grid stretching with fixed 3-column layout Development Environment: - Add docker-compose.override.yml for local development - Create Dockerfile.dev with hot-reload support - Add start-dev.sh and nginx.dev.conf - Update README.dev.md with development setup instructions Production Build: - Fix frontend/Dockerfile multi-stage build (as → AS) - Update prod.sh to explicitly use docker-compose.yml (ignore override) - Resolve node:18-alpine image corruption issue - Backend Dockerfile improvements for Node 14 compatibility Documentation: - Update TODO.md marking completed frontend tasks - Clean up docs/images directory - Update README.md with current project status All changes tested and verified in both development and production environments.
2.6 KiB
2.6 KiB
TODO / Offene Punkte
Diese Datei listet die noch offenen Arbeiten, die ich im Projekt verfolge. Ich pflege sie, sobald ich Aufgaben erledige.
Anstehende Aufgaben
Frontend
- Code Cleanup & Refactoring
- Überprüfung der Komponentenstruktur
- Entfernen ungenutzter Dateien
- Vereinheitlichung der ImageGallery Komponente:
ImagePreviewGalleryund 'GroupCard' zusammenführen- Die neue Komponente soll ImageGallery heißen. Sie besteht aus einem Grid aus "GroupCard" die
GroupCardsoll zukünfigImageGalleryCardheißen. - Die neue Komponente
ImageGallerysoll so aussehen wir die GroupCard im Grid -> siehe Pages/ModerationGroupPage.js und Pages/GroupOverviewPage.js und auch die gleichen Funktionalitäten besitzen.
- Die neue Komponente soll ImageGallery heißen. Sie besteht aus einem Grid aus "GroupCard" die
- Klärung SimpleMultiDropzone vs. MultiImageUploadDropzone (MultiImageUploadDropzone wurde gelösch, SimpleMultiDropzone umbenannt in MultiImageDropzone)
- Persistentes Reordering: Drag-and-drop in
ImagePreviewGallery+ Backend-Endpunkt
Zusätzliche Funktionen
Backend
[x] Erweiterung der API um die Funktion bestehende Daten zu editieren/aktualisieren [ ] Integration eines Benachrichtigungssystems (E-Mail, Push-Benachrichtigungen) wenn eine neue Slideshow hochgeladen wurde [ ] Implementierung eines Logging-Systems zur Nachverfolgung von Änderungen und Aktivitäten
Frontend
[x] Erweiterung der Benutzeroberfläche um eine Editierfunktion für bestehende Einträge in ModerationPage.js [x] In der angezeigten Gruppen soll statt Bilder ansehen Gruppe editieren stehen [x] Diese bestehende Ansicht (Bilder ansehen) soll als eigene Seite implementiert werden
🚀 Deployment-Überlegungen
Speicher-Management
- Komprimierung: Automatische Bildkomprimierung für große Dateien
Sicherheit
- File-Type Validation: Nur erlaubte Bildformate
- Virus-Scanning: Optional für Produktionsumgebung
📈 Erweiterungs-Möglichkeiten (Zukunft)
Erweiterte Features
- Benutzer-Accounts: Upload-Gruppen Benutzern zuordnen
- Export: Slideshow als Video oder PDF exportieren
Admin-Features
- Bulk-Operations: Mehrere Gruppen gleichzeitig verwalten (zum Beispiel löschen)
🎯 Erfolgskriterien
Must-Have
- ✅ Mobile-Kompatibilität
Nice-to-Have
- 🎨 Drag & Drop Reihenfolge ändern
- 📊 Upload-Progress mit Details
- 🖼️ Thumbnail-Navigation in Slideshow
- 🔄 Batch-Operations (alle entfernen, etc.)
Future Features
- 👤 User-Management
- 🏷️ Tagging-System
- 📤 Export-Funktionen
- 🎵 Audio-Integration