chore: bump version to 1.0.43

- Modified backend password validation for galleries to be more lenient
- Reduced minimum password length to 6 characters for galleries
- Removed uppercase/lowercase/number requirements for gallery passwords
- Allow date formats like "04.07.2025" as passwords
- Added helper text to inform users about password options
- Still prevent overly simple passwords like "123456"
- Admin passwords remain strict with all security requirements

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

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

.gitea/workflows/mirror-to-github.yml

@@ -4,6 +4,7 @@ on:
   push:
     branches:
       - main
+  workflow_dispatch:  # Allow manual triggering
 
 jobs:
   mirror:
@@ -19,11 +20,22 @@ jobs:
           git config --global user.name "the-luap"
           git config --global user.email "paul-nothaft@hotmail.de"
 
+      - name: Debug - Show current branch and status
+        run: |
+          echo "Current branch:"
+          git branch -a
+          echo "Git status:"
+          git status
+          echo "Remote info:"
+          git remote -v
+
       - name: Create filtered branch
         run: |
-        
+          # Clean up any existing github-mirror branch
+          git branch -D github-mirror || true
+          
           # Create a new branch for GitHub
-          git checkout --orphan -b github-mirror
+          git checkout --orphan github-mirror
           
           # Remove sensitive files/directories
           # Example: Remove .env files, private configs, etc.
@@ -43,17 +55,45 @@ jobs:
           git rm -r --cached CLAUDE.md || true
           git rm -r --cached PRODUCTION_DEPLOYMENT_GUIDE.md || true
           git rm -r --cached logs/ || true
+          git rm -r --cached frontend/.claudedocs/ || true
+          git rm -r --cached test-maintenance.sh || true
+          git rm -r --cached storage/ || true
 
         
           # Commit the changes
           git commit -m "Remove sensitive files for GitHub mirror" || true
 
+      - name: Check GitHub token
+        env:
+          GITHUBTOKEN: ${{ secrets.GITHUBTOKEN }}
+        run: |
+          if [ -z "$GITHUBTOKEN" ]; then
+            echo "ERROR: GITHUBTOKEN secret is not set!"
+            exit 1
+          else
+            echo "GitHub token is available (length: ${#GITHUBTOKEN})"
+          fi
+
       - name: Push to GitHub
         env:
           GITHUBTOKEN: ${{ secrets.GITHUBTOKEN }}
         run: |
+          # Remove existing github remote if it exists
+          git remote remove github || true
+          
           # Add GitHub remote
           git remote add github https://x-access-token:${GITHUBTOKEN}@github.com/the-luap/picpeak.git
           
+          # Verify remote was added
+          echo "GitHub remote added:"
+          git remote -v
+          
           # Force push the filtered branch to GitHub main
-          git push github github-mirror:main --force
+          echo "Pushing to GitHub..."
+          git push github github-mirror:main --force
+          echo "Push completed successfully!"
+
+      - name: Workflow completed
+        run: |
+          echo "✅ Mirror to GitHub workflow completed successfully!"
+          echo "Check https://github.com/the-luap/picpeak to verify the mirror."

README.md

@@ -11,8 +11,7 @@
 
 **PicPeak** is a powerful, self-hosted open-source alternative to commercial photo-sharing platforms like PicDrop.com and Scrapbook.de. Designed specifically for photographers and event organizers, PicPeak makes it simple to share beautiful, time-limited photo galleries with clients while maintaining full control over your data and branding.
 
-![PicPeak Gallery Preview](https://github.com/the-luap/picpeak/assets/placeholder-hero.png)
-> 📸 *Gallery preview will be updated soon with latest interface*
+![PicPeak Gallery Preview](docs/screenshot-gallery.png)
 
 ## 🌟 Why Choose PicPeak?
 

backend/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "picpeak-backend",
-  "version": "1.0.38",
+  "version": "1.0.43",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "picpeak-backend",
-      "version": "1.0.38",
+      "version": "1.0.43",
       "dependencies": {
         "adm-zip": "^0.5.16",
         "archiver": "^5.3.1",

backend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "picpeak-backend",
-  "version": "1.0.38",
+  "version": "1.0.43",
   "description": "Backend for PicPeak event photo sharing platform",
   "main": "server.js",
   "scripts": {

backend/scripts/README.md

@@ -1,103 +0,0 @@
-# Storage Management Scripts
-
-## check-storage.js
-
-Checks the storage directory structure and verifies that photo files exist.
-
-### Usage:
-```bash
-# Check overall storage structure
-node scripts/check-storage.js
-
-# Check specific event
-node scripts/check-storage.js wedding-test-gallery-2025-07-14-1
-```
-
-### What it checks:
-- Storage directory structure and permissions
-- Event directories
-- Photo files existence
-- Thumbnail files existence
-- Database vs filesystem consistency
-
-## regenerate-thumbnails.js
-
-Regenerates missing thumbnails for photos in the database.
-
-### Usage:
-```bash
-# Regenerate all missing thumbnails
-node scripts/regenerate-thumbnails.js
-
-# Regenerate thumbnails for specific event (by ID)
-node scripts/regenerate-thumbnails.js 2
-```
-
-### What it does:
-- Scans photos in database
-- Checks if thumbnails exist
-- Generates missing thumbnails using Sharp
-- Updates database with thumbnail paths
-- Reports success/error statistics
-
-### Prerequisites:
-- Node.js environment
-- Database access
-- Write permissions to storage directory
-- Sharp library installed
-
-## Production Usage
-
-On your production server:
-
-1. First, check the storage structure:
-   ```bash
-   cd /path/to/picpeak/backend
-   NODE_ENV=production node scripts/check-storage.js wedding-test-gallery-2025-07-14-1
-   ```
-
-2. If thumbnails are missing, regenerate them:
-   ```bash
-   NODE_ENV=production node scripts/regenerate-thumbnails.js 2
-   ```
-
-Note: Replace `2` with the actual event ID from your database.
-
-## cleanup-thumbnails.js
-
-Cleans up temporary and orphaned thumbnail files.
-
-### Usage:
-```bash
-# Dry run - see what would be deleted
-node scripts/cleanup-thumbnails.js --dry-run
-
-# Actually delete orphaned thumbnails
-node scripts/cleanup-thumbnails.js
-```
-
-### What it does:
-- Identifies temporary thumbnails (thumb_temp_*)
-- Finds orphaned thumbnails not linked to any photo
-- Removes unnecessary files to free up space
-- Reports statistics on cleanup
-
-## diagnose-thumbnails.js
-
-Diagnoses why thumbnails might not be showing for a specific event.
-
-### Usage:
-```bash
-node scripts/diagnose-thumbnails.js 2
-```
-
-### What it checks:
-- Thumbnail paths in database vs filesystem
-- Path format inconsistencies
-- Missing thumbnail files
-- Provides SQL to fix path issues
-
-### Common Issues:
-1. **Path mismatch**: Database has wrong thumbnail path format
-2. **Missing files**: Thumbnails were never generated
-3. **Permission issues**: Web server can't read thumbnail files

backend/src/utils/passwordValidation.js

@@ -111,7 +111,39 @@ function validatePassword(password, options = {}) {
  * @returns {Object} - Validation result
  */
 function validatePasswordInContext(password, context, userData = {}) {
-  // Base validation
+  // For gallery context, use more lenient validation
+  if (context === 'gallery') {
+    // Gallery-specific validation options
+    const galleryOptions = {
+      minLength: 6, // Reduced minimum length
+      requireUppercase: false, // Don't require uppercase for galleries
+      requireLowercase: false, // Don't require lowercase for galleries
+      requireNumbers: false, // Numbers are optional
+      requireSpecialChars: false, // Special chars are optional
+      preventCommonPasswords: true, // Still prevent common passwords
+      minStrengthScore: 0 // Accept any score for galleries
+    };
+    
+    // Base validation with gallery-specific options
+    const result = validatePassword(password, galleryOptions);
+    
+    // Additional gallery-specific checks
+    if (password.length < 6) {
+      result.valid = false;
+      result.errors = ['Password must be at least 6 characters long'];
+    }
+    
+    // Allow date-based passwords like "04.07.2025"
+    // Check if it's too simple (e.g., just "123456")
+    if (/^\d{1,6}$/.test(password)) {
+      result.valid = false;
+      result.errors.push('Password cannot be just numbers. Consider using a date format like "04.07.2025"');
+    }
+    
+    return result;
+  }
+  
+  // Base validation for other contexts
   const result = validatePassword(password);
   
   // Context-specific validation
@@ -136,16 +168,6 @@ function validatePasswordInContext(password, context, userData = {}) {
         result.errors.push('Password must not contain parts of your email');
       }
     }
-  } else if (context === 'gallery') {
-    // Gallery passwords can be more lenient for user convenience
-    // Allow passwords with score >= 1 (weak but acceptable)
-    if (result.score < 1) {
-      result.valid = false;
-      result.errors.push('Password is too simple. Please add more complexity');
-    }
-    
-    // Don't check for event name in password - allow date-based passwords
-    // This allows passwords like "Sommer2025!" which users prefer
   }
   
   return result;

frontend/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "picpeak-frontend",
-  "version": "1.0.38",
+  "version": "1.0.43",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "picpeak-frontend",
-      "version": "1.0.38",
+      "version": "1.0.43",
       "dependencies": {
         "@tanstack/react-query": "^5.0.0",
         "@tiptap/extension-link": "^2.25.0",

frontend/package.json

@@ -1,7 +1,7 @@
 {
   "name": "picpeak-frontend",
   "private": true,
-  "version": "1.0.38",
+  "version": "1.0.43",
   "type": "module",
   "scripts": {
     "dev": "vite",

frontend/src/components/common/AuthenticatedImage.tsx

@@ -62,9 +62,14 @@ export const AuthenticatedImage: React.FC<AuthenticatedImageProps> = ({
         let imageUrl = src;
         
         // Build full URL for the image
-        const fullImageUrl = imageUrl.startsWith('/') ? buildResourceUrl(imageUrl) : imageUrl;
+        // For API paths that start with /admin, we need to prepend /api
+        const fullImageUrl = imageUrl.startsWith('/admin') 
+          ? buildResourceUrl(`/api${imageUrl}`)
+          : imageUrl.startsWith('/') 
+          ? buildResourceUrl(imageUrl) 
+          : imageUrl;
         
-        console.log('Fetching authenticated image:', fullImageUrl);
+        // console.log('Fetching authenticated image:', fullImageUrl);
         const response = await fetch(fullImageUrl, {
           headers: {
             'Authorization': `Bearer ${token}`

frontend/src/components/gallery/PhotoLightbox.tsx

@@ -162,7 +162,7 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
       {/* Close button */}
       <button
         onClick={onClose}
-        className="absolute top-4 right-4 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors z-10"
+        className="absolute top-4 right-4 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors z-20"
         aria-label="Close"
       >
         <X className="w-6 h-6 text-white" />
@@ -171,7 +171,7 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
       {/* Navigation buttons */}
       <button
         onClick={goToPrevious}
-        className="absolute left-4 top-1/2 -translate-y-1/2 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors z-10"
+        className="absolute left-4 top-1/2 -translate-y-1/2 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors z-20"
         aria-label="Previous photo"
       >
         <ChevronLeft className="w-6 h-6 text-white" />
@@ -179,20 +179,19 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
 
       <button
         onClick={goToNext}
-        className="absolute right-4 top-1/2 -translate-y-1/2 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors z-10"
+        className="absolute right-4 top-1/2 -translate-y-1/2 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors z-20"
         aria-label="Next photo"
       >
         <ChevronRight className="w-6 h-6 text-white" />
       </button>
 
       {/* Bottom toolbar */}
-      <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 to-transparent p-4">
+      <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/80 to-transparent p-4 z-20">
         <div className="max-w-4xl mx-auto flex items-center justify-between">
           <div className="text-white">
             <p className="text-sm opacity-75">
               {currentIndex + 1} / {photos.length}
             </p>
-            <p className="font-medium">{currentPhoto.filename}</p>
           </div>
           
           <div className="flex items-center gap-2">
@@ -231,7 +230,7 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
 
       {/* Image container */}
       <div
-        className="absolute inset-0 flex items-center justify-center"
+        className="absolute inset-0 flex items-center justify-center z-0"
         onClick={handleImageClick}
         onMouseDown={handleMouseDown}
         onMouseMove={handleMouseMove}
@@ -257,7 +256,7 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
       </div>
 
       {/* Touch/swipe indicators for mobile */}
-      <div className="absolute bottom-20 left-1/2 -translate-x-1/2 text-white text-sm opacity-50 pointer-events-none md:hidden">
+      <div className="absolute bottom-20 left-1/2 -translate-x-1/2 text-white text-sm opacity-50 pointer-events-none md:hidden z-20">
         Swipe to navigate
       </div>
     </div>

frontend/src/pages/admin/CreateEventPage.tsx

@@ -204,6 +204,9 @@ export const CreateEventPage: React.FC = () => {
       newErrors.password = t('validation.passwordRequired');
     } else if (formData.password.length < 6) {
       newErrors.password = t('validation.passwordMinLength');
+    } else if (/^\d{1,6}$/.test(formData.password)) {
+      // Prevent simple numeric passwords like "123456"
+      newErrors.password = t('validation.passwordTooSimple', 'Password cannot be just numbers. Consider using a date format like "04.07.2025"');
     }
 
     if (formData.password !== formData.confirm_password) {
@@ -412,6 +415,7 @@ export const CreateEventPage: React.FC = () => {
                   onChange={handleInputChange('password')}
                   error={errors.password}
                   placeholder={t('events.enterPassword')}
+                  helperText={t('events.passwordHelperText', 'You can use dates like "04.07.2025" or any text with 6+ characters')}
                   leftIcon={<Lock className="w-5 h-5 text-neutral-400" />}
                   className="pr-10"
                 />

frontend/src/pages/admin/CreateEventPageEnhanced.tsx

@@ -180,6 +180,9 @@ export const CreateEventPageEnhanced: React.FC = () => {
       newErrors.password = t('validation.passwordRequired');
     } else if (formData.password.length < 6) {
       newErrors.password = t('validation.passwordMinLength');
+    } else if (/^\d{1,6}$/.test(formData.password)) {
+      // Prevent simple numeric passwords like "123456"
+      newErrors.password = t('validation.passwordTooSimple', 'Password cannot be just numbers. Consider using a date format like "04.07.2025"');
     }
 
     if (formData.password !== formData.confirm_password) {
@@ -309,7 +312,6 @@ export const CreateEventPageEnhanced: React.FC = () => {
                 value={formData.event_date}
                 onChange={handleInputChange('event_date')}
                 error={errors.event_date}
-                min={format(new Date(), 'yyyy-MM-dd')}
                 leftIcon={<Calendar className="w-5 h-5" />}
               />
             </div>
@@ -454,6 +456,7 @@ export const CreateEventPageEnhanced: React.FC = () => {
                 value={formData.password}
                 onChange={handleInputChange('password')}
                 error={errors.password}
+                helperText={t('events.passwordHelperText', 'You can use dates like "04.07.2025" or any text with 6+ characters')}
                 leftIcon={<Lock className="w-5 h-5" />}
                 rightIcon={
                   <button

frontend/src/pages/admin/EventsListPage.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useMemo } from 'react';
+import React, { useState, useMemo, useEffect, useRef } from 'react';
 import { useNavigate, useSearchParams } from 'react-router-dom';
 import { 
   Plus, 
@@ -33,12 +33,47 @@ export const EventsListPage: React.FC = () => {
   const [selectedEvents, setSelectedEvents] = useState<number[]>([]);
   // const [showFilters, setShowFilters] = useState(false);
   const [activeDropdown, setActiveDropdown] = useState<number | null>(null);
+  const [dropdownPosition, setDropdownPosition] = useState<{ top: number; left: number } | null>(null);
   const [showBulkArchiveModal, setShowBulkArchiveModal] = useState(false);
 
   // Get filter from URL
   const statusFilter = searchParams.get('filter') as 'active' | 'archived' | null;
   const isExpiringFilter = searchParams.get('filter') === 'expiring';
 
+  // Close dropdown when clicking outside
+  useEffect(() => {
+    const handleClickOutside = (event: MouseEvent) => {
+      const target = event.target as HTMLElement;
+      if (!target.closest('.dropdown-container')) {
+        setActiveDropdown(null);
+        setDropdownPosition(null);
+      }
+    };
+
+    if (activeDropdown !== null) {
+      document.addEventListener('mousedown', handleClickOutside);
+      return () => document.removeEventListener('mousedown', handleClickOutside);
+    }
+  }, [activeDropdown]);
+
+  // Update dropdown position on scroll/resize
+  useEffect(() => {
+    const handleScrollOrResize = () => {
+      if (activeDropdown !== null) {
+        setActiveDropdown(null);
+        setDropdownPosition(null);
+      }
+    };
+
+    window.addEventListener('scroll', handleScrollOrResize, true);
+    window.addEventListener('resize', handleScrollOrResize);
+    
+    return () => {
+      window.removeEventListener('scroll', handleScrollOrResize, true);
+      window.removeEventListener('resize', handleScrollOrResize);
+    };
+  }, [activeDropdown]);
+
   // Fetch events
   const { data, isLoading, error } = useQuery({
     queryKey: ['admin-events', statusFilter],
@@ -272,8 +307,8 @@ export const EventsListPage: React.FC = () => {
       </Card>
 
       {/* Events Table */}
-      <Card className="overflow-hidden">
-        <div className="overflow-x-auto">
+      <Card className="overflow-visible">
+        <div className="overflow-x-auto overflow-y-visible">
           <table className="w-full">
             <thead className="bg-neutral-50 border-b border-neutral-200">
               <tr>
@@ -347,21 +382,38 @@ export const EventsListPage: React.FC = () => {
                         {event.expires_at ? format(parseISO(event.expires_at), 'MMM d, yyyy') : 'N/A'}
                       </td>
                       <td className="px-6 py-4 text-right">
-                        <div className="relative inline-block text-left">
+                        <div className="relative inline-block text-left dropdown-container">
                           <button
-                            onClick={() => setActiveDropdown(activeDropdown === event.id ? null : event.id)}
+                            onClick={(e) => {
+                              e.stopPropagation();
+                              if (activeDropdown === event.id) {
+                                setActiveDropdown(null);
+                                setDropdownPosition(null);
+                              } else {
+                                const rect = e.currentTarget.getBoundingClientRect();
+                                setActiveDropdown(event.id);
+                                setDropdownPosition({
+                                  top: rect.bottom + window.scrollY,
+                                  left: rect.right - 224 + window.scrollX // 224px = 14rem (w-56)
+                                });
+                              }
+                            }}
                             className="text-neutral-400 hover:text-neutral-600 p-1"
                           >
                             <MoreVertical className="w-5 h-5" />
                           </button>
                           
-                          {activeDropdown === event.id && (
-                            <div className="absolute right-0 z-10 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5">
+                          {activeDropdown === event.id && dropdownPosition && (
+                            <div 
+                              className="fixed z-50 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
+                              style={{ top: `${dropdownPosition.top}px`, left: `${dropdownPosition.left}px` }}
+                            >
                               <div className="py-1">
                                 <button
                                   onClick={() => {
                                     navigate(`/admin/events/${event.id}`);
                                     setActiveDropdown(null);
+                                    setDropdownPosition(null);
                                   }}
                                   className="w-full text-left px-4 py-2 text-sm text-neutral-700 hover:bg-neutral-100 flex items-center gap-2"
                                 >
@@ -374,7 +426,10 @@ export const EventsListPage: React.FC = () => {
                                     target="_blank"
                                     rel="noopener noreferrer"
                                     className="w-full text-left px-4 py-2 text-sm text-neutral-700 hover:bg-neutral-100 flex items-center gap-2"
-                                    onClick={() => setActiveDropdown(null)}
+                                    onClick={() => {
+                                      setActiveDropdown(null);
+                                      setDropdownPosition(null);
+                                    }}
                                   >
                                     <ExternalLink className="w-4 h-4" />
                                     {t('events.viewGallery')}
@@ -385,6 +440,7 @@ export const EventsListPage: React.FC = () => {
                                     onClick={() => {
                                       archiveMutation.mutate(event.id);
                                       setActiveDropdown(null);
+                                      setDropdownPosition(null);
                                     }}
                                     className="w-full text-left px-4 py-2 text-sm text-neutral-700 hover:bg-neutral-100 flex items-center gap-2"
                                   >
@@ -397,6 +453,7 @@ export const EventsListPage: React.FC = () => {
                                     onClick={() => {
                                       toast.info(t('events.downloadArchiveSoon'));
                                       setActiveDropdown(null);
+                                      setDropdownPosition(null);
                                     }}
                                     className="w-full text-left px-4 py-2 text-sm text-neutral-700 hover:bg-neutral-100 flex items-center gap-2"
                                   >
@@ -409,6 +466,7 @@ export const EventsListPage: React.FC = () => {
                                     if (confirm(t('events.deleteEventConfirm'))) {
                                       deleteMutation.mutate(event.id);
                                       setActiveDropdown(null);
+                                      setDropdownPosition(null);
                                     }
                                   }}
                                   className="w-full text-left px-4 py-2 text-sm text-red-600 hover:bg-red-50 flex items-center gap-2"

frontend/src/services/settings.service.ts

@@ -100,7 +100,7 @@ export const settingsService = {
     formData.append('logo', file);
     
     const response = await api.post<{ logoUrl: string }>(
-      '/api/admin/settings/logo',
+      '/admin/settings/logo',
       formData,
       {
         headers: {
@@ -118,7 +118,7 @@ export const settingsService = {
     formData.append('favicon', file);
     
     const response = await api.post<{ faviconUrl: string }>(
-      '/api/admin/settings/favicon',
+      '/admin/settings/favicon',
       formData,
       {
         headers: {
@@ -136,7 +136,7 @@ export const settingsService = {
     formData.append('watermarkLogo', file);
     
     const response = await api.post<{ watermarkLogoUrl: string }>(
-      '/api/admin/settings/branding/watermark-logo',
+      '/admin/settings/branding/watermark-logo',
       formData,
       {
         headers: {