Add complete frontend implementation and Docker deployment setup

- Implement React frontend with TypeScript and Tailwind CSS
- Add scrappbook.de-inspired UI design with photo galleries
- Implement authentication, photo viewing, and download features
- Add Docker Swarm configuration with Traefik reverse proxy
- Set up Drone CI/CD pipeline for automated deployments
- Add monitoring stack with Prometheus and Grafana
- Create comprehensive deployment documentation
- Add simple local development setup with docker-compose.local.yml

Features:
- Password-protected galleries with expiration warnings
- Responsive photo grid with lightbox viewer
- Bulk download functionality
- Hot reload development environment
- Email testing with Mailhog
- Production-ready deployment scripts

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

frontend/src/hooks/useGallery.ts

@@ -0,0 +1,64 @@
+import { useQuery, useMutation } from '@tanstack/react-query';
+import { galleryService } from '../services';
+import { toast } from 'react-toastify';
+
+export const useGalleryInfo = (slug: string) => {
+  return useQuery({
+    queryKey: ['gallery-info', slug],
+    queryFn: () => galleryService.getGalleryInfo(slug),
+    retry: 1,
+    staleTime: 5 * 60 * 1000, // 5 minutes
+  });
+};
+
+export const useGalleryPhotos = (slug: string, enabled: boolean = true) => {
+  return useQuery({
+    queryKey: ['gallery-photos', slug],
+    queryFn: () => galleryService.getGalleryPhotos(slug),
+    enabled,
+    retry: 1,
+    staleTime: 5 * 60 * 1000, // 5 minutes
+  });
+};
+
+export const useGalleryStats = (slug: string, enabled: boolean = true) => {
+  return useQuery({
+    queryKey: ['gallery-stats', slug],
+    queryFn: () => galleryService.getGalleryStats(slug),
+    enabled,
+    retry: 1,
+    staleTime: 60 * 1000, // 1 minute
+  });
+};
+
+export const useDownloadPhoto = () => {
+  return useMutation({
+    mutationFn: ({
+      slug,
+      photoId,
+      filename,
+    }: {
+      slug: string;
+      photoId: number;
+      filename: string;
+    }) => galleryService.downloadPhoto(slug, photoId, filename),
+    onSuccess: () => {
+      toast.success('Photo downloaded successfully');
+    },
+    onError: () => {
+      toast.error('Failed to download photo');
+    },
+  });
+};
+
+export const useDownloadAllPhotos = () => {
+  return useMutation({
+    mutationFn: (slug: string) => galleryService.downloadAllPhotos(slug),
+    onSuccess: () => {
+      toast.success('Download started');
+    },
+    onError: () => {
+      toast.error('Failed to download photos');
+    },
+  });
+};