chore: bump frontend version to 1.0.73

- Changed from public settings endpoint to admin settings endpoint
- Fixed "Unexpected token '<'" JSON parse error
- Properly transforms settings array to key-value map
- Uses correct setting keys (analytics_umami_*)
- Maintains fallback to environment variables

The analytics page now correctly fetches Umami configuration using
the authenticated admin API instead of the public endpoint, which
was returning errors and causing JSON parse failures.

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

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

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

@@ -10,10 +10,10 @@ jobs:
   mirror:
     runs-on: ubuntu-latest
     steps:
-      - name: Checkout repository
+      - name: Checkout repository with full history
         uses: actions/checkout@v3
         with:
-          fetch-depth: 0  # Full history needed for mirroring
+          fetch-depth: 0  # Full history needed for finding the commit
 
       - name: Setup Git
         run: |
@@ -28,40 +28,144 @@ jobs:
           git status
           echo "Remote info:"
           git remote -v
+          echo "Checking target commit exists:"
+          git show --oneline 7aca927937 || echo "Target commit not found!"
 
-      - name: Create filtered branch
+      - name: Create completely new history from specific commit
         run: |
+          TARGET_COMMIT="7aca927937"
+          
+          # Verify the target commit exists
+          if ! git cat-file -e $TARGET_COMMIT^{commit}; then
+            echo "ERROR: Target commit $TARGET_COMMIT does not exist!"
+            exit 1
+          fi
+          
+          echo "✅ Target commit found: $(git log --oneline -1 $TARGET_COMMIT)"
+          
           # Clean up any existing github-mirror branch
           git branch -D github-mirror || true
           
-          # Create a new branch for GitHub
+          # Create a completely new orphan branch (no history)
           git checkout --orphan github-mirror
           
-          # Remove sensitive files/directories
+          # Clear the staging area completely
-          # Example: Remove .env files, private configs, etc.
+          git rm -rf . || true
-          git rm -r --cached .env* || true
+          
-          git rm -r --cached backend/.env* || true
+          # Get the file tree from the target commit and create initial commit
-          git rm -r --cached frontend/.env* || true
+          echo "Creating new history starting from $TARGET_COMMIT..."
-          git rm -r --cached docker-compose.prod.yml || true
+          git read-tree $TARGET_COMMIT
-          git rm -r --cached .claudedocs/ || true
+          git commit -m "Initial commit - imported from $(git log --oneline -1 $TARGET_COMMIT)"
-          git rm -r --cached backend/data/ || true
+          
-          git rm -r --cached backend/storage/ || true
+          echo "✅ Created new initial commit: $(git log --oneline -1)"
-          git rm -r --cached .gitea/ || true
+          
-          git rm -r --cached scripts/install-gitea-runner.sh || true
+          # Now get all commits after the target commit and apply their changes
-          git rm -r --cached .drone* || true
+          COMMITS_AFTER_TARGET=$(git rev-list --reverse --no-merges $TARGET_COMMIT..main)
-          git rm -r --cached .github-mirror-exclude || true
+          
-          git rm -r --cached .gitattributes-github || true
+          if [ -n "$COMMITS_AFTER_TARGET" ]; then
-          git rm -r --cached photo-sharing-prd.md || true
+            echo "📋 Applying changes from commits after $TARGET_COMMIT:"
-          git rm -r --cached CLAUDE.md || true
+            
-          git rm -r --cached PRODUCTION_DEPLOYMENT_GUIDE.md || true
+            for commit in $COMMITS_AFTER_TARGET; do
-          git rm -r --cached logs/ || true
+              echo "Processing: $(git log --oneline -1 $commit)"
-          git rm -r --cached frontend/.claudedocs/ || true
+              
-          git rm -r --cached test-maintenance.sh || true
+              # Get the commit message and author info
-          git rm -r --cached storage/ || true
+              COMMIT_MSG=$(git log --format="%B" -n 1 $commit)
+              COMMIT_AUTHOR=$(git log --format="%an <%ae>" -n 1 $commit)
+              COMMIT_DATE=$(git log --format="%ad" -n 1 $commit)
+              
+              # Apply the changes from this commit
+              if git diff-tree --no-commit-id --name-only -r $commit | xargs -I {} git show $commit:{} > /dev/null 2>&1; then
+                # Apply file changes
+                git checkout $commit -- . || true
+                
+                # Stage all changes
+                git add -A
+                
+                # Only commit if there are changes
+                if ! git diff --cached --quiet; then
+                  # Create new commit with original metadata but new SHA
+                  GIT_AUTHOR_NAME=$(echo "$COMMIT_AUTHOR" | cut -d'<' -f1 | xargs)
+                  GIT_AUTHOR_EMAIL=$(echo "$COMMIT_AUTHOR" | cut -d'<' -f2 | cut -d'>' -f1)
+                  GIT_AUTHOR_DATE="$COMMIT_DATE"
+                  
+                  export GIT_AUTHOR_NAME GIT_AUTHOR_EMAIL GIT_AUTHOR_DATE
+                  git commit -m "$COMMIT_MSG"
+                  echo "✅ Applied changes as new commit: $(git log --oneline -1)"
+                else
+                  echo "⚠️ No changes to commit for $commit"
+                fi
+              else
+                echo "⚠️ Skipping problematic commit $commit"
+              fi
+            done
+            
+            echo "✅ Finished creating new history"
+          else
+            echo "✅ No commits after target commit - history starts fresh"
+          fi
+          
+          echo ""
+          echo "=== New History Summary ==="
+          echo "Total commits in new history: $(git rev-list --count github-mirror)"
+          echo "History starts with: $(git log --oneline --reverse | head -1)"
+          echo "Latest commit: $(git log --oneline -1)"
 
-        
+      - name: Remove sensitive files and directories
-          # Commit the changes
+        run: |
-          git commit -m "Remove sensitive files for GitHub mirror" || true
+          # Switch to the github-mirror branch
+          git checkout github-mirror
+          
+          echo "Current files before cleanup:"
+          ls -la | head -10 || true
+          echo "..."
+          
+          # Remove sensitive files/directories if they exist
+          echo "Removing sensitive files..."
+          rm -rf .env* || true
+          rm -rf backend/.env* || true
+          rm -rf frontend/.env* || true
+          rm -rf docker-compose.prod.yml || true
+          rm -rf .claudedocs/ || true
+          rm -rf backend/data/ || true
+          rm -rf backend/storage/ || true
+          rm -rf .gitea/ || true
+          rm -rf scripts/install-gitea-runner.sh || true
+          rm -rf .drone* || true
+          rm -rf .github-mirror-exclude || true
+          rm -rf .gitattributes-github || true
+          rm -rf photo-sharing-prd.md || true
+          rm -rf CLAUDE.md || true
+          rm -rf PRODUCTION_DEPLOYMENT_GUIDE.md || true
+          rm -rf logs/ || true
+          rm -rf frontend/.claudedocs/ || true
+          rm -rf test-maintenance.sh || true
+          rm -rf storage/ || true
+          
+          echo "Sensitive files removal completed"
+          
+          # Add and commit the cleanup if there are changes
+          git add -A
+          if ! git diff --cached --quiet; then
+            git commit -m "chore: remove sensitive files for GitHub mirror"
+            echo "✅ Committed cleanup of sensitive files"
+          else
+            echo "✅ No sensitive files to remove"
+          fi
+          
+          echo "Final file structure (top level):"
+          ls -la | head -10 || true
+
+      - name: Verify completely new history
+        run: |
+          git checkout github-mirror
+          echo "=== Final History Verification ==="
+          echo "Total commits in new github-mirror branch: $(git rev-list --count github-mirror)"
+          echo ""
+          echo "Complete commit history (should start from target commit content):"
+          git log --oneline --reverse
+          echo ""
+          echo "⚠️ Note: This is a completely NEW history with new commit SHAs"
+          echo "🔍 Original target commit content preserved but with new commit ID"
 
       - name: Check GitHub token
         env:
@@ -74,10 +178,13 @@ jobs:
             echo "GitHub token is available (length: ${#GITHUBTOKEN})"
           fi
 
-      - name: Push to GitHub
+      - name: Force push completely new history to GitHub
         env:
           GITHUBTOKEN: ${{ secrets.GITHUBTOKEN }}
         run: |
+          # Switch to github-mirror branch
+          git checkout github-mirror
+          
           # Remove existing github remote if it exists
           git remote remove github || true
           
@@ -88,12 +195,17 @@ jobs:
           echo "GitHub remote added:"
           git remote -v
           
-          # Force push the filtered branch to GitHub main
+          # Force push the completely new history to GitHub main
-          echo "Pushing to GitHub..."
+          echo "🔥 FORCE PUSHING completely new history to GitHub..."
+          echo "⚠️ This will COMPLETELY REPLACE all history on GitHub!"
           git push github github-mirror:main --force
-          echo "Push completed successfully!"
+          echo "✅ Force push completed - GitHub now has completely new history!"
 
       - name: Workflow completed
         run: |
           echo "✅ Mirror to GitHub workflow completed successfully!"
-          echo "Check https://github.com/the-luap/picpeak to verify the mirror."
+          echo "🔥 COMPLETE HISTORY REPLACEMENT: GitHub now has entirely new history"
+          echo "📊 History starts from commit content: 7aca927937"
+          echo "🔍 Check https://github.com/the-luap/picpeak to verify the new history"
+          echo "📈 Total commits pushed: $(git rev-list --count github-mirror)"
+          echo "🆕 All commit SHAs are NEW - no connection to previous history"

.gitea/workflows/version-and-release.yml

@@ -164,11 +164,25 @@ jobs:
       - name: Commit version bump
         if: steps.version.outputs.version_changed == 'true'
         run: |
+          set -e  # Exit on any error
+          
+          # First, ensure we have the latest changes
+          echo "Fetching latest changes..."
+          git fetch origin main
+          
+          # Check if we're behind and need to update
+          LOCAL=$(git rev-parse HEAD)
+          REMOTE=$(git rev-parse origin/main)
+          
+          if [ "$LOCAL" != "$REMOTE" ]; then
+            echo "Local is behind remote, pulling changes..."
+            git pull origin main --no-rebase
+          fi
+          
           COMPONENT="${{ steps.version.outputs.component_changed }}"
           
           if [ "$COMPONENT" = "both" ]; then
-            git add backend/package.json backend/package-lock.json
+            git add backend/package.json backend/package-lock.json frontend/package.json frontend/package-lock.json
-            git add frontend/package.json frontend/package-lock.json
             git commit -m "chore: bump version to ${{ steps.version.outputs.new_version }} (backend + frontend)"
           elif [ "$COMPONENT" = "backend" ]; then
             git add backend/package.json backend/package-lock.json
@@ -178,7 +192,51 @@ jobs:
             git commit -m "chore: bump frontend version to ${{ steps.version.outputs.new_version }}"
           fi
           
-          git push
+          # Pull latest changes before pushing to avoid conflicts
+          echo "Pulling latest changes from origin/main..."
+          if ! git pull --rebase origin main; then
+            echo "Rebase failed, attempting to resolve..."
+            # If rebase fails, abort and try a regular merge
+            git rebase --abort || true
+            git pull origin main --no-rebase
+          fi
+          
+          # Push the changes with retry logic
+          echo "Pushing version bump..."
+          PUSH_SUCCESS=false
+          
+          for i in 1 2 3; do
+            echo "Push attempt $i of 3..."
+            
+            # Try to push
+            if git push origin main 2>&1; then
+              echo "Successfully pushed version bump on attempt $i"
+              PUSH_SUCCESS=true
+              break
+            else
+              echo "Push failed on attempt $i"
+              
+              if [ $i -lt 3 ]; then
+                echo "Waiting 5 seconds before retry..."
+                sleep 5
+                
+                echo "Pulling latest changes..."
+                git fetch origin main
+                
+                # Try rebase first, fall back to merge
+                if ! git rebase origin/main; then
+                  echo "Rebase failed, trying merge..."
+                  git rebase --abort 2>/dev/null || true
+                  git pull origin main --no-rebase
+                fi
+              fi
+            fi
+          done
+          
+          if [ "$PUSH_SUCCESS" = "false" ]; then
+            echo "ERROR: Failed to push after 3 attempts"
+            exit 1
+          fi
       
       - name: Create Git tag
         if: steps.version.outputs.version_changed == 'true'

.gitignore

@@ -54,3 +54,5 @@ coverage/
 !storage/thumbnails/.gitkeep
 !data/.gitkeep
 !logs/.gitkeep
+
+PRODUCTION_DEPLOYMENT_GUIDE.md

PRODUCTION_TODO_LIST.md

@@ -0,0 +1,714 @@
+# 🚀 Production Todo List - PicPeak Enhancements
+
+**Priority:** HIGH - These are production fixes and enhancements
+**Estimated Time:** 2-3 days
+**Status:** Ready for Implementation
+
+---
+
+## 📋 Action Items Overview
+
+1. [Password Complexity Settings](#1-password-complexity-settings)
+2. [Gallery Login Page - Remove Event Date](#2-gallery-login-page---remove-event-date)
+3. [Analytics Umami Configuration Check](#3-analytics-umami-configuration-check)
+4. [Analytics Numbers Accuracy Fix](#4-analytics-numbers-accuracy-fix)
+5. [Missing Translation Key Fix](#5-missing-translation-key-fix)
+6. [Complete Translation Audit](#6-complete-translation-audit)
+7. [CMS Page Long German Text Formatting](#7-cms-page-long-german-text-formatting)
+8. [Event Creation Date Format Fix](#8-event-creation-date-format-fix)
+9. [Language Selector Country Flags Chrome Fix](#9-language-selector-country-flags-chrome-fix)
+
+---
+
+## 1. Password Complexity Settings
+
+**Problem:** Admin security tab only has password minimum length setting, no complexity requirements.
+
+**Current State:** 
+- File: `frontend/src/pages/admin/SettingsPage.tsx` (lines 635-669)
+- Backend: `backend/src/utils/passwordValidation.js` has complexity logic but not exposed in settings
+
+**Implementation:**
+
+### Frontend Changes:
+```typescript
+// File: frontend/src/pages/admin/SettingsPage.tsx
+// Add to securitySettings state (around line 61):
+const [securitySettings, setSecuritySettings] = useState({
+  require_password: true,
+  password_min_length: 8,
+  password_complexity_level: 'medium', // ADD THIS
+  enable_2fa: false,
+  session_timeout_minutes: 60,
+  max_login_attempts: 5,
+  enable_recaptcha: false,
+  recaptcha_site_key: '',
+  recaptcha_secret_key: ''
+});
+
+// Add complexity setting UI after password_min_length (around line 660):
+<div>
+  <label className="block text-sm font-medium text-neutral-700 mb-1">
+    {t('settings.security.passwordComplexity')}
+  </label>
+  <select
+    value={securitySettings.password_complexity_level}
+    onChange={(e) => setSecuritySettings(prev => ({ ...prev, password_complexity_level: e.target.value }))}
+    className="w-full px-3 py-2 border border-neutral-300 rounded-lg focus:ring-2 focus:ring-primary-500"
+  >
+    <option value="low">{t('settings.security.complexityLow')}</option>
+    <option value="medium">{t('settings.security.complexityMedium')}</option>
+    <option value="high">{t('settings.security.complexityHigh')}</option>
+  </select>
+  <p className="text-xs text-neutral-500 mt-1">
+    {t('settings.security.complexityHelp')}
+  </p>
+</div>
+```
+
+### Translation Updates:
+```json
+// File: frontend/src/i18n/locales/en.json (add to settings.security):
+"passwordComplexity": "Password Complexity Level",
+"complexityLow": "Low - Length only",
+"complexityMedium": "Medium - Letters and numbers",
+"complexityHigh": "High - Letters, numbers, and symbols",
+"complexityHelp": "Controls password requirements for new gallery passwords"
+
+// File: frontend/src/i18n/locales/de.json (add to settings.security):
+"passwordComplexity": "Passwort-Komplexitätsstufe",
+"complexityLow": "Niedrig - Nur Länge",
+"complexityMedium": "Mittel - Buchstaben und Zahlen",
+"complexityHigh": "Hoch - Buchstaben, Zahlen und Symbole",
+"complexityHelp": "Steuert Passwort-Anforderungen für neue Galerie-Passwörter"
+```
+
+### Backend Changes:
+```javascript
+// File: backend/src/utils/passwordValidation.js
+// Update PASSWORD_CONFIG based on settings (around line 8):
+const getPasswordConfigFromSettings = async () => {
+  const { db } = require('../database/db');
+  const settings = await db('admin_settings').select('key', 'value');
+  const settingsMap = settings.reduce((acc, setting) => {
+    acc[setting.key] = setting.value;
+    return acc;
+  }, {});
+  
+  const complexityLevel = settingsMap.security_password_complexity_level || 'medium';
+  
+  return {
+    ...PASSWORD_CONFIG,
+    minLength: parseInt(settingsMap.security_password_min_length) || 8,
+    requireUppercase: complexityLevel !== 'low',
+    requireLowercase: complexityLevel !== 'low', 
+    requireNumbers: complexityLevel === 'high' || complexityLevel === 'medium',
+    requireSpecialChars: complexityLevel === 'high',
+    minStrengthScore: complexityLevel === 'high' ? 3 : (complexityLevel === 'medium' ? 2 : 1)
+  };
+};
+```
+
+---
+
+## 2. Gallery Login Page - Remove Event Date
+
+**Problem:** Gallery login shows event date which is often used as password, creating security risk.
+
+**Current State:**
+- File: `frontend/src/pages/GalleryPage.tsx` (lines 275-285)
+- Shows both event name and date with calendar icon
+
+**Implementation:**
+
+### Frontend Changes:
+```typescript
+// File: frontend/src/pages/GalleryPage.tsx
+// Replace the date display section (around lines 280-285):
+
+// REMOVE THIS:
+/*
+<div className="flex items-center justify-center text-xs sm:text-sm" style={{ color: 'var(--color-text, #171717)', opacity: 0.7 }}>
+  <Calendar className="w-3 h-3 sm:w-4 sm:h-4 mr-1" />
+  <span className="truncate">{format(parseISO(galleryInfo!.event_date), 'PP')}</span>
+</div>
+*/
+
+// REPLACE WITH:
+<div className="text-center text-xs sm:text-sm" style={{ color: 'var(--color-text, #171717)', opacity: 0.7 }}>
+  <span className="truncate">{galleryInfo?.event_type ? t(`events.types.${galleryInfo.event_type}`) : ''}</span>
+</div>
+```
+
+### Additional Layout Improvements:
+```typescript
+// File: frontend/src/pages/GalleryPage.tsx
+// Update the header section for better visual balance (around line 275):
+<div className="text-center mb-4 sm:mb-6">
+  <img 
+    src={settingsData?.branding_logo_url ? 
+      buildResourceUrl(settingsData.branding_logo_url) : 
+      '/picpeak-logo-transparent.png'
+    } 
+    alt={settingsData?.branding_company_name || 'PicPeak'}
+    className="h-12 sm:h-16 lg:h-20 w-auto object-contain mx-auto mb-3 sm:mb-4"
+  />
+  <h1 className="text-xl sm:text-2xl lg:text-3xl font-bold mb-2 px-2" style={{ color: 'var(--color-text, #171717)' }}>
+    {galleryInfo?.event_name}
+  </h1>
+  {/* Event type instead of date */}
+  {galleryInfo?.event_type && (
+    <div className="text-center text-sm" style={{ color: 'var(--color-text, #171717)', opacity: 0.7 }}>
+      <span className="px-3 py-1 bg-white/20 rounded-full backdrop-blur-sm">
+        {t(`events.types.${galleryInfo.event_type}`)}
+      </span>
+    </div>
+  )}
+</div>
+```
+
+---
+
+## 3. Analytics Umami Configuration Check
+
+**Problem:** Analytics page shows "Umami Analytics Not Configured" even when configured in settings.
+
+**Current State:**
+- File: `frontend/src/pages/admin/AnalyticsPage.tsx` (lines 67-87)
+- Check logic may not be working correctly
+
+**Implementation:**
+
+### Frontend Fix:
+```typescript
+// File: frontend/src/pages/admin/AnalyticsPage.tsx
+// Fix the Umami configuration check (around lines 67-87):
+
+// REPLACE the useEffect:
+useEffect(() => {
+  const fetchUmamiConfig = async () => {
+    try {
+      const response = await fetch(`${import.meta.env.VITE_API_URL}/api/public/settings`);
+      const settings = await response.json();
+      
+      // Check if Umami is properly configured
+      const isConfigured = settings.analytics_umami_enabled && 
+                          settings.analytics_umami_url && 
+                          settings.analytics_umami_website_id;
+      
+      if (isConfigured) {
+        setUmamiConfig({
+          url: settings.analytics_umami_url,
+          shareUrl: settings.analytics_umami_share_url,
+          websiteId: settings.analytics_umami_website_id,
+          enabled: true
+        });
+      } else {
+        // Fall back to environment variables
+        const envConfigured = import.meta.env.VITE_UMAMI_URL && 
+                             import.meta.env.VITE_UMAMI_WEBSITE_ID;
+        
+        setUmamiConfig({
+          url: import.meta.env.VITE_UMAMI_URL,
+          shareUrl: import.meta.env.VITE_UMAMI_SHARE_URL,
+          websiteId: import.meta.env.VITE_UMAMI_WEBSITE_ID,
+          enabled: envConfigured
+        });
+      }
+    } catch (error) {
+      console.error('Failed to fetch Umami config:', error);
+      setUmamiConfig({ enabled: false });
+    }
+  };
+
+  fetchUmamiConfig();
+}, []);
+
+// Update the configuration notice condition (around line 441):
+{!umamiConfig.enabled && (
+  <Card padding="md" className="mt-6 bg-amber-50 border-amber-200">
+    <div className="flex items-start gap-3">
+      <Activity className="w-5 h-5 text-amber-600 flex-shrink-0" />
+      <div>
+        <p className="text-sm font-medium text-amber-900">{t('analytics.notConfigured')}</p>
+        <p className="text-sm text-amber-700 mt-1">
+          {t('analytics.configureInstructions')}
+        </p>
+      </div>
+    </div>
+  </Card>
+)}
+```
+
+---
+
+## 4. Analytics Numbers Accuracy Fix
+
+**Problem:** Dashboard shows correct numbers but analytics page shows different numbers.
+
+**Current State:**
+- Dashboard: `frontend/src/services/admin.service.ts` `getDashboardStats()`
+- Analytics: `frontend/src/services/admin.service.ts` `getAnalytics()`
+- Backend: Different endpoints with potentially different calculation logic
+
+**Implementation:**
+
+### Backend Investigation and Fix:
+```javascript
+// File: backend/src/routes/adminDashboard.js
+// Ensure consistent calculation logic in both /stats and /analytics endpoints
+
+// Update the analytics endpoint (around line 216) to use the same calculation as stats:
+router.get('/analytics', adminAuth, async (req, res) => {
+  try {
+    const days = sanitizeDays(req.query.days || 7);
+    
+    // Use same calculation logic as /stats endpoint
+    const thirtyDaysAgo = new Date();
+    thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - days);
+    
+    // Get total downloads - SAME logic as /stats
+    const totalDownloads = await db('access_logs')
+      .whereIn('action', ['download', 'download_all'])
+      .where('timestamp', '>=', thirtyDaysAgo.toISOString())
+      .count('id as count')
+      .first();
+
+    // Get total views - SAME logic as /stats  
+    const totalViews = await db('access_logs')
+      .where('action', 'view')
+      .where('timestamp', '>=', thirtyDaysAgo.toISOString())
+      .count('id as count')
+      .first();
+
+    // ... rest of the analytics logic
+
+    // Add totals to response for verification
+    res.json({
+      chartData: dates,
+      topGalleries,
+      devices,
+      totals: {
+        totalViews: totalViews.count,
+        totalDownloads: totalDownloads.count,
+        period: `${days} days`
+      }
+    });
+  } catch (error) {
+    console.error('Analytics error:', error);
+    res.status(500).json({ error: 'Failed to fetch analytics data' });
+  }
+});
+```
+
+### Frontend Verification:
+```typescript
+// File: frontend/src/pages/admin/AnalyticsPage.tsx
+// Add debug information in development (around line 107):
+
+const analytics: ComponentAnalyticsData | undefined = React.useMemo(() => {
+  if (!apiData) return undefined;
+
+  // Calculate totals from chart data
+  const totalViews = apiData.chartData.reduce((sum, day) => sum + day.views, 0);
+  const totalDownloads = apiData.chartData.reduce((sum, day) => sum + day.downloads, 0);
+
+  // Debug: Compare with API totals in development
+  if (process.env.NODE_ENV === 'development' && apiData.totals) {
+    console.log('Analytics Debug:', {
+      calculatedViews: totalViews,
+      apiTotalViews: apiData.totals.totalViews,
+      calculatedDownloads: totalDownloads,
+      apiTotalDownloads: apiData.totals.totalDownloads,
+      period: apiData.totals.period
+    });
+  }
+
+  // ... rest of the calculation
+}, [apiData]);
+```
+
+---
+
+## 5. Missing Translation Key Fix
+
+**Problem:** Missing translation key `admin.activities.analytics_settings_updated` in recent activities.
+
+**Current State:**
+- Key not found in `frontend/src/i18n/locales/en.json` or `de.json`
+
+**Implementation:**
+
+### Translation Updates:
+```json
+// File: frontend/src/i18n/locales/en.json
+// Add to admin.activities section (around line 785):
+"analytics_settings_updated": "Analytics settings updated"
+
+// File: frontend/src/i18n/locales/de.json  
+// Add to admin.activities section (around line 710):
+"analytics_settings_updated": "Analytik-Einstellungen aktualisiert"
+```
+
+### Backend Activity Logging:
+```javascript
+// File: backend/src/routes/adminSettings.js (or wherever analytics settings are updated)
+// Ensure activity is logged with correct key:
+
+await logActivity(req.admin.id, 'analytics_settings_updated', {
+  settingsUpdated: Object.keys(updateData).filter(key => key.startsWith('analytics_')),
+  timestamp: new Date()
+});
+```
+
+---
+
+## 6. Complete Translation Audit
+
+**Problem:** Need to check all recent activity types for missing translations.
+
+**Current State:**
+- Activity types defined in backend, translations in frontend
+
+**Implementation:**
+
+### Audit Script:
+```bash
+# Create a script to find missing translation keys
+# File: scripts/audit-translations.js
+
+const fs = require('fs');
+const path = require('path');
+
+// Read translation files
+const enTranslations = JSON.parse(fs.readFileSync('frontend/src/i18n/locales/en.json', 'utf8'));
+const deTranslations = JSON.parse(fs.readFileSync('frontend/src/i18n/locales/de.json', 'utf8'));
+
+// Common activity types that should exist
+const requiredActivityKeys = [
+  'event_created', 'event_updated', 'event_deleted', 'event_archived',
+  'photos_uploaded', 'photo_deleted', 'photos_bulk_deleted',
+  'archive_downloaded', 'archive_deleted', 'archive_restored',
+  'email_config_updated', 'email_template_updated',
+  'branding_updated', 'theme_updated', 'analytics_settings_updated',
+  'general_settings_updated', 'security_settings_updated',
+  'category_created', 'category_updated', 'category_deleted',
+  'cms_page_updated', 'favicon_uploaded',
+  'bulk_download', 'gallery_password_entry', 'expiration_warning_viewed'
+];
+
+console.log('Missing English translations:');
+requiredActivityKeys.forEach(key => {
+  if (!enTranslations.admin?.activities?.[key]) {
+    console.log(`- admin.activities.${key}`);
+  }
+});
+
+console.log('\nMissing German translations:');
+requiredActivityKeys.forEach(key => {
+  if (!deTranslations.admin?.activities?.[key]) {
+    console.log(`- admin.activities.${key}`);
+  }
+});
+```
+
+### Missing Translations to Add:
+```json
+// File: frontend/src/i18n/locales/en.json
+// Add any missing keys to admin.activities:
+"analytics_settings_updated": "Analytics settings updated",
+"cms_page_updated": "CMS page updated: {{page}}",
+"security_settings_updated": "Security settings updated", 
+"password_reset": "Password reset for: {{eventName}}",
+"admin_logout": "Admin {{actorName}} logged out",
+"system_activity": "System activity: {{type}}"
+
+// File: frontend/src/i18n/locales/de.json
+// German equivalents:
+"analytics_settings_updated": "Analytik-Einstellungen aktualisiert",
+"cms_page_updated": "CMS-Seite aktualisiert: {{page}}",
+"security_settings_updated": "Sicherheitseinstellungen aktualisiert",
+"password_reset": "Passwort zurückgesetzt für: {{eventName}}",
+"admin_logout": "Admin {{actorName}} abgemeldet",
+"system_activity": "Systemaktivität: {{type}}"
+```
+
+---
+
+## 7. CMS Page Long German Text Formatting
+
+**Problem:** Long German text like "Datenschutzerklärung" pushes image to left and looks ugly.
+
+**Current State:**
+- File: `frontend/src/pages/admin/CMSPageEnhanced.tsx` (lines 130-170)
+- File: `frontend/src/pages/admin/CMSPage.tsx` (lines 90-110)
+
+**Implementation:**
+
+### CSS Fix:
+```typescript
+// File: frontend/src/pages/admin/CMSPageEnhanced.tsx
+// Update the page selection buttons (around line 130):
+
+<button
+  key={page.slug}
+  onClick={() => {
+    if (hasUnsavedChanges) {
+      if (confirm('You have unsaved changes. Do you want to save them?')) {
+        handleSave();
+      }
+    }
+    setSelectedPage(page.slug);
+  }}
+  className={`w-full text-left px-4 py-3 rounded-lg transition-colors flex items-center gap-3 ${
+    selectedPage === page.slug
+      ? 'bg-primary-100 text-primary-700 border border-primary-300'
+      : 'bg-white border border-neutral-200 hover:bg-neutral-50'
+  }`}
+>
+  <FileText className="w-5 h-5 flex-shrink-0" />
+  <div className="flex-1 min-w-0"> {/* Add min-w-0 for text overflow */}
+    <p className="font-medium text-sm truncate" title={t(`legal.${page.slug}`)}>
+      {t(`legal.${page.slug}`)}
+    </p>
+    <p className="text-xs text-neutral-500 truncate">/{page.slug}</p>
+  </div>
+  {selectedPage === page.slug && hasUnsavedChanges && (
+    <div className="w-2 h-2 bg-yellow-500 rounded-full flex-shrink-0" />
+  )}
+</button>
+```
+
+### Alternative - Responsive Layout:
+```typescript
+// File: frontend/src/pages/admin/CMSPageEnhanced.tsx
+// Alternative: Use responsive text sizing
+
+<p className="font-medium text-sm sm:text-base truncate" title={t(`legal.${page.slug}`)}>
+  {/* For very long German words, show abbreviated version */}
+  {t(`legal.${page.slug}`).length > 15 
+    ? `${t(`legal.${page.slug}`).substring(0, 12)}...`
+    : t(`legal.${page.slug}`)
+  }
+</p>
+```
+
+---
+
+## 8. Event Creation Date Format Fix
+
+**Problem:** Event creation page uses browser English format instead of saved admin settings date format.
+
+**Current State:**
+- Files: `frontend/src/pages/admin/CreateEventPageEnhanced.tsx`, `CreateEventPage.tsx`
+- Uses browser locale instead of admin date format settings
+
+**Implementation:**
+
+### Hook Enhancement:
+```typescript
+// File: frontend/src/hooks/useLocalizedDate.ts
+// Add admin settings integration:
+
+import { useTranslation } from 'react-i18next';
+import { format as dateFnsFormat, formatDistanceToNow as dateFnsFormatDistanceToNow } from 'date-fns';
+import { de, enUS, enGB } from 'date-fns/locale';
+import { useQuery } from '@tanstack/react-query';
+import { settingsService } from '../services/settings.service';
+
+export const useLocalizedDate = () => {
+  const { i18n } = useTranslation();
+  
+  // Fetch admin date format settings
+  const { data: settings } = useQuery({
+    queryKey: ['admin-date-settings'],
+    queryFn: () => settingsService.getAllSettings(),
+    staleTime: 10 * 60 * 1000, // Cache for 10 minutes
+  });
+  
+  const getLocale = () => {
+    // Use admin settings if available, otherwise fall back to i18n language
+    const savedFormat = settings?.general_date_format;
+    if (savedFormat?.locale) {
+      switch (savedFormat.locale) {
+        case 'en-US': return enUS;
+        case 'en-GB': return enGB;
+        case 'de': return de;
+        default: return i18n.language === 'de' ? de : enUS;
+      }
+    }
+    return i18n.language === 'de' ? de : enUS;
+  };
+  
+  const getDateFormat = () => {
+    const savedFormat = settings?.general_date_format?.format;
+    if (savedFormat) {
+      // Convert admin format to date-fns format
+      switch (savedFormat) {
+        case 'DD/MM/YYYY': return 'dd/MM/yyyy';
+        case 'MM/DD/YYYY': return 'MM/dd/yyyy';
+        case 'YYYY-MM-DD': return 'yyyy-MM-dd';
+        case 'DD.MM.YYYY': return 'dd.MM.yyyy';
+        default: return 'dd/MM/yyyy';
+      }
+    }
+    return i18n.language === 'de' ? 'dd.MM.yyyy' : 'MM/dd/yyyy';
+  };
+  
+  const format = (date: Date | string, formatStr?: string) => {
+    const dateObj = typeof date === 'string' ? new Date(date) : date;
+    const finalFormat = formatStr || getDateFormat();
+    return dateFnsFormat(dateObj, finalFormat, { locale: getLocale() });
+  };
+  
+  // ... rest of the hook
+};
+```
+
+### Event Creation Page Fix:
+```typescript
+// File: frontend/src/pages/admin/CreateEventPageEnhanced.tsx
+// Update the expiration date display (around line 495):
+
+{formData.event_date && (
+  <p className="mt-2 text-sm text-neutral-500">
+    {t('events.expiresOn')}: {format(addDays(new Date(formData.event_date), formData.expires_in_days), 'PPP')}
+  </p>
+)}
+```
+
+---
+
+## 9. Language Selector Country Flags Chrome Fix
+
+**Problem:** Country flags not showing in Chrome browser on Windows in admin language selector.
+
+**Current State:**
+- File: `frontend/src/components/common/LanguageSelector.tsx` (lines 5-8)
+- Uses emoji flags: `🇬🇧`, `🇩🇪`
+
+**Implementation:**
+
+### SVG Icon Replacement:
+```typescript
+// File: frontend/src/components/common/LanguageSelector.tsx
+// Replace emoji flags with SVG icons or image flags:
+
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { Globe } from 'lucide-react';
+
+// SVG flag components for better browser compatibility
+const FlagGB: React.FC<{ className?: string }> = ({ className = "w-4 h-4" }) => (
+  <svg className={className} viewBox="0 0 640 480" fill="none">
+    <path fill="#012169" d="M0 0h640v480H0z"/>
+    <path fill="#FFF" d="m75 0 244 181L562 0h78v62L400 241l240 178v61h-80L320 301 81 480H0v-60l239-178L0 64V0h75z"/>
+    <path fill="#C8102E" d="m424 281 216 159v40L369 281h55zm-184 20 6 35L54 480H0l246-179zM640 0v3L391 191l2-44L590 0h50zM0 0l239 176h-60L0 42V0z"/>
+    <path fill="#FFF" d="M241 0v480h160V0H241zM0 160v160h640V160H0z"/>
+    <path fill="#C8102E" d="M0 193v96h640v-96H0zM273 0v480h96V0h-96z"/>
+  </svg>
+);
+
+const FlagDE: React.FC<{ className?: string }> = ({ className = "w-4 h-4" }) => (
+  <svg className={className} viewBox="0 0 640 480" fill="none">
+    <path fill="#ffce00" d="M0 320h640v160H0z"/>
+    <path d="M0 0h640v160H0z"/>
+    <path fill="#d00" d="M0 160h640v160H0z"/>
+  </svg>
+);
+
+const languages = [
+  { code: 'en', name: 'English', flag: FlagGB },
+  { code: 'de', name: 'Deutsch', flag: FlagDE },
+];
+
+export const LanguageSelector: React.FC = () => {
+  const { i18n } = useTranslation();
+  const [isOpen, setIsOpen] = React.useState(false);
+
+  const currentLanguage = languages.find(lang => lang.code === i18n.language) || languages[0];
+
+  const handleLanguageChange = (languageCode: string) => {
+    i18n.changeLanguage(languageCode);
+    setIsOpen(false);
+  };
+
+  return (
+    <div className="relative">
+      <button
+        onClick={() => setIsOpen(!isOpen)}
+        className="flex items-center gap-2 px-3 py-2 text-sm font-medium text-neutral-700 bg-white border border-neutral-300 rounded-lg hover:bg-neutral-50 focus:outline-none focus:ring-2 focus:ring-primary-500"
+      >
+        <Globe className="w-4 h-4" />
+        <currentLanguage.flag className="w-4 h-4" />
+        <span>{currentLanguage.name}</span>
+      </button>
+
+      {isOpen && (
+        <div className="absolute right-0 mt-2 w-48 bg-white rounded-lg shadow-lg border border-neutral-200 py-1 z-50">
+          {languages.map((language) => (
+            <button
+              key={language.code}
+              onClick={() => handleLanguageChange(language.code)}
+              className={`w-full text-left px-4 py-2 text-sm hover:bg-neutral-50 flex items-center gap-3 ${
+                language.code === i18n.language
+                  ? 'text-primary-600 bg-primary-50'
+                  : 'text-neutral-700'
+              }`}
+            >
+              <language.flag className="w-4 h-4" />
+              <span>{language.name}</span>
+            </button>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+};
+```
+
+### Alternative - Image Flags:
+```typescript
+// Alternative solution using flag images:
+const languages = [
+  { code: 'en', name: 'English', flag: '/flags/gb.svg' },
+  { code: 'de', name: 'Deutsch', flag: '/flags/de.svg' },
+];
+
+// Add images to public/flags/ directory
+// Use: <img src={language.flag} alt={language.name} className="w-4 h-4" />
+```
+
+---
+
+## 🔍 Testing Instructions
+
+### After implementing each fix:
+
+1. **Password Complexity**: Test different complexity levels in admin settings
+2. **Gallery Login**: Verify event date is hidden on gallery login pages  
+3. **Analytics Check**: Verify "Not Configured" message appears/disappears correctly
+4. **Analytics Numbers**: Compare dashboard vs analytics page numbers
+5. **Translations**: Check recent activities display correct translations
+6. **CMS Formatting**: Test with long German page names
+7. **Date Format**: Test event creation with different admin date settings
+8. **Language Flags**: Test language selector in Chrome on Windows
+
+### Regression Testing:
+- [ ] Gallery login still works correctly
+- [ ] Analytics page displays correctly when Umami is configured
+- [ ] Admin settings save and load correctly
+- [ ] Event creation works with all date formats
+- [ ] Language switching works in all browsers
+
+---
+
+## 📝 Notes
+
+- All changes maintain backward compatibility
+- No database schema changes required
+- Frontend changes are non-breaking
+- Can be deployed incrementally
+- All text is properly internationalized
+
+**⚠️ Important**: Test each fix in isolation before combining, especially the analytics changes as they affect production data display. 

backend/knexfile.js

@@ -40,10 +40,10 @@ const config = {
       keepAliveInitialDelayMillis: 0
     },
     pool: {
-      min: 2,
+      min: 5,
-      max: 10,
+      max: 25,
-      acquireTimeoutMillis: 30000,
+      acquireTimeoutMillis: 60000,
-      createTimeoutMillis: 30000,
+      createTimeoutMillis: 60000,
       idleTimeoutMillis: 30000,
       reapIntervalMillis: 1000,
       createRetryIntervalMillis: 200,

backend/package-lock.json

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

backend/package.json

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

backend/src/database/db.js

@@ -4,6 +4,33 @@ const knexConfig = require('../../knexfile');
 // Create database connection with built-in retry logic
 const db = knex(knexConfig);
 
+// Connection retry configuration
+const MAX_RETRIES = 3;
+const RETRY_DELAY = 1000;
+
+// Wrapper function to handle connection retries
+async function withRetry(queryFn, retries = MAX_RETRIES) {
+  for (let i = 0; i < retries; i++) {
+    try {
+      return await queryFn();
+    } catch (error) {
+      const isConnectionError = error.message && (
+        error.message.includes('Connection terminated unexpectedly') ||
+        error.message.includes('Connection ended unexpectedly') ||
+        error.message.includes('ECONNREFUSED') ||
+        error.message.includes('ETIMEDOUT')
+      );
+      
+      if (isConnectionError && i < retries - 1) {
+        console.log(`Database connection error, retrying in ${RETRY_DELAY}ms... (attempt ${i + 1}/${retries})`);
+        await new Promise(resolve => setTimeout(resolve, RETRY_DELAY * (i + 1)));
+        continue;
+      }
+      throw error;
+    }
+  }
+}
+
 async function initializeDatabase() {
   // Events table
   const hasEventsTable = await db.schema.hasTable('events');
@@ -225,4 +252,4 @@ async function logActivity(activityType, metadata = {}, eventId = null, actor =
   }
 }
 
-module.exports = { db, initializeDatabase, logActivity };
+module.exports = { db, initializeDatabase, logActivity, withRetry };

backend/src/middleware/gallery.js

@@ -1,5 +1,5 @@
 const jwt = require('jsonwebtoken');
-const { db } = require('../database/db');
+const { db, withRetry } = require('../database/db');
 const { formatBoolean } = require('../utils/dbCompat');
 
 // Middleware to verify gallery access
@@ -11,13 +11,15 @@ async function verifyGalleryAccess(req, res, next) {
     }
     
     const decoded = jwt.verify(token, process.env.JWT_SECRET);
-    const event = await db('events')
+    const event = await withRetry(async () => {
-      .where({ 
+      return await db('events')
-        id: decoded.eventId, 
+        .where({ 
-        is_active: formatBoolean(true),
+          id: decoded.eventId, 
-        is_archived: formatBoolean(false)
+          is_active: formatBoolean(true),
-      })
+          is_archived: formatBoolean(false)
-      .first();
+        })
+        .first();
+    });
     
     if (!event) {
       return res.status(404).json({ error: 'Gallery not found or expired' });

backend/src/middleware/sessionTimeout.js

@@ -10,7 +10,7 @@ const DEFAULT_SESSION_TIMEOUT = 60 * 60 * 1000;
 // Cache for session timeout setting
 let cachedTimeout = null;
 let cacheExpiry = 0;
-const CACHE_DURATION = 5 * 60 * 1000; // 5 minutes
+const CACHE_DURATION = 30 * 60 * 1000; // 30 minutes - reduced DB queries
 
 // Clean up expired sessions every 5 minutes
 setInterval(() => {

backend/src/routes/adminDashboard.js

@@ -310,10 +310,33 @@ router.get('/analytics', adminAuth, async (req, res) => {
       devices[d.device_type] = Math.round((d.count / totalDevices) * 100);
     });
 
+    // Calculate totals for the period (matching /stats logic)
+    const totalViews = await db('access_logs')
+      .where('action', 'view')
+      .where('timestamp', '>=', startDateStr)
+      .count('id as count')
+      .first();
+
+    const totalDownloadsCount = await db('access_logs')
+      .whereIn('action', ['download', 'download_all'])
+      .where('timestamp', '>=', startDateStr)
+      .count('id as count')
+      .first();
+
+    const totalUniqueVisitors = await db('access_logs')
+      .where('timestamp', '>=', startDateStr)
+      .countDistinct('ip_address as count')
+      .first();
+
     res.json({
       chartData: dates,
       topGalleries,
-      devices
+      devices,
+      totals: {
+        views: totalViews?.count || 0,
+        downloads: totalDownloadsCount?.count || 0,
+        uniqueVisitors: totalUniqueVisitors?.count || 0
+      }
     });
   } catch (error) {
     console.error('Analytics error:', error);

backend/src/routes/adminSystem.js

@@ -1,5 +1,5 @@
 const express = require('express');
-const { db } = require('../database/db');
+const { db, withRetry } = require('../database/db');
 const { adminAuth } = require('../middleware/auth-enhanced-v2');
 const fs = require('fs').promises;
 const path = require('path');

backend/src/routes/publicSettings.js

@@ -1,5 +1,5 @@
 const express = require('express');
-const { db } = require('../database/db');
+const { db, withRetry } = require('../database/db');
 const router = express.Router();
 
 // Get public settings (branding and theme)
@@ -7,12 +7,14 @@ router.get('/', async (req, res) => {
   try {
     // Fetch branding, theme, general, and security settings
     // Note: We include analytics in the query but it might not exist yet
-    const settings = await db('app_settings')
+    const settings = await withRetry(async () => {
-      .where(function() {
+      return await db('app_settings')
-        this.whereIn('setting_type', ['branding', 'theme', 'general', 'security', 'analytics'])
+        .where(function() {
-          .orWhere('setting_key', 'like', 'analytics_%');
+          this.whereIn('setting_type', ['branding', 'theme', 'general', 'security', 'analytics'])
-      })
+            .orWhere('setting_key', 'like', 'analytics_%');
-      .select('setting_key', 'setting_value');
+        })
+        .select('setting_key', 'setting_value');
+    });
     
     // Convert to object format
     const settingsObject = {};

backend/src/services/emailService.js

@@ -60,6 +60,7 @@ async function processEmailQueue() {
 }
 
 // Start email queue processor
-setInterval(processEmailQueue, 60000); // Process every minute
+// DISABLED: Using emailProcessor.js instead to prevent duplicate connections
+// setInterval(processEmailQueue, 60000); // Process every minute
 
 module.exports = { sendEmail, processEmailQueue };

backend/src/utils/passwordValidation.js

@@ -113,6 +113,84 @@ function validatePassword(password, options = {}) {
   };
 }
 
+/**
+ * Get complexity settings from database
+ * @returns {Object} - Password complexity configuration
+ */
+async function getPasswordComplexitySettings() {
+  try {
+    const { db, withRetry } = require('../database/db');
+    
+    // Use retry wrapper to handle connection failures
+    const settings = await withRetry(async () => {
+      return await db('app_settings')
+        .where('setting_key', 'security_password_complexity_level')
+        .first();
+    });
+    
+    if (!settings || !settings.setting_value) {
+      return 'moderate'; // Default
+    }
+    
+    const value = typeof settings.setting_value === 'string' 
+      ? JSON.parse(settings.setting_value)
+      : settings.setting_value;
+    
+    return value;
+  } catch (error) {
+    logger.error('Failed to get password complexity settings:', error);
+    return 'moderate'; // Default on error - ensures app continues working
+  }
+}
+
+/**
+ * Get password configuration based on complexity level
+ * @param {string} complexityLevel - Complexity level (simple, moderate, strong, very_strong)
+ * @returns {Object} - Password configuration
+ */
+function getPasswordConfigForComplexity(complexityLevel) {
+  const configs = {
+    simple: {
+      minLength: 6,
+      requireUppercase: false,
+      requireLowercase: false,
+      requireNumbers: false,
+      requireSpecialChars: false,
+      preventCommonPasswords: true,
+      minStrengthScore: 0
+    },
+    moderate: {
+      minLength: 8,
+      requireUppercase: true,
+      requireLowercase: true,
+      requireNumbers: true,
+      requireSpecialChars: false,
+      preventCommonPasswords: true,
+      minStrengthScore: 2
+    },
+    strong: {
+      minLength: 12,
+      requireUppercase: true,
+      requireLowercase: true,
+      requireNumbers: true,
+      requireSpecialChars: false,
+      preventCommonPasswords: true,
+      minStrengthScore: 3
+    },
+    very_strong: {
+      minLength: 12,
+      requireUppercase: true,
+      requireLowercase: true,
+      requireNumbers: true,
+      requireSpecialChars: true,
+      preventCommonPasswords: true,
+      minStrengthScore: 3
+    }
+  };
+  
+  return configs[complexityLevel] || configs.moderate;
+}
+
 /**
  * Validate password for specific contexts (admin, gallery)
  * @param {string} password - Password to validate
@@ -120,19 +198,16 @@ function validatePassword(password, options = {}) {
  * @param {Object} userData - Additional user data for context-aware validation
  * @returns {Object} - Validation result
  */
-function validatePasswordInContext(password, context, userData = {}) {
+async function validatePasswordInContext(password, context, userData = {}) {
-  // For gallery context, use more lenient validation
+  // For gallery context, use dynamic complexity settings
   if (context === 'gallery') {
-    // Gallery-specific validation options
+    // Get complexity settings from database
+    const complexityLevel = await getPasswordComplexitySettings();
+    
+    // Get configuration for the complexity level
     const galleryOptions = {
-      minLength: 6, // Reduced minimum length
+      ...getPasswordConfigForComplexity(complexityLevel),
-      requireUppercase: false, // Don't require uppercase for galleries
+      skipStrengthCheck: complexityLevel === 'simple' // Skip zxcvbn for simple passwords
-      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
-      skipStrengthCheck: true // Skip zxcvbn strength analysis for galleries
     };
     
     // Base validation with gallery-specific options
@@ -281,5 +356,7 @@ module.exports = {
   generateSecurePassword,
   getBcryptRounds,
   logPasswordValidationFailure,
+  getPasswordComplexitySettings,
+  getPasswordConfigForComplexity,
   PASSWORD_CONFIG
 };

frontend/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "picpeak-frontend",
-  "version": "1.0.68",
+  "version": "1.0.73",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "picpeak-frontend",
-      "version": "1.0.68",
+      "version": "1.0.73",
       "dependencies": {
         "@tanstack/react-query": "^5.0.0",
         "@tiptap/extension-character-count": "^2.26.1",

frontend/package.json

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

frontend/src/components/common/LanguageSelector.tsx

@@ -2,9 +2,28 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { Globe } from 'lucide-react';
 
+// SVG Flag Components
+const GBFlag: React.FC<{ className?: string }> = ({ className = "w-5 h-5" }) => (
+  <svg className={className} viewBox="0 0 640 480" xmlns="http://www.w3.org/2000/svg">
+    <path fill="#012169" d="M0 0h640v480H0z"/>
+    <path fill="#FFF" d="m75 0 244 181L562 0h78v62L400 241l240 178v61h-80L320 301 81 480H0v-60l239-178L0 64V0h75z"/>
+    <path fill="#C8102E" d="m424 281 216 159v40L369 281h55zm-184 20 6 35L54 480H0l240-179zM640 0v3L391 191l2-44L590 0h50zM0 0l239 176h-60L0 42V0z"/>
+    <path fill="#FFF" d="M241 0v480h160V0H241zM0 160v160h640V160H0z"/>
+    <path fill="#C8102E" d="M0 193v96h640v-96H0zM273 0v480h96V0h-96z"/>
+  </svg>
+);
+
+const DEFlag: React.FC<{ className?: string }> = ({ className = "w-5 h-5" }) => (
+  <svg className={className} viewBox="0 0 640 480" xmlns="http://www.w3.org/2000/svg">
+    <path fill="#000" d="M0 0h640v160H0z"/>
+    <path fill="#D00" d="M0 160h640v160H0z"/>
+    <path fill="#FFCE00" d="M0 320h640v160H0z"/>
+  </svg>
+);
+
 const languages = [
-  { code: 'en', name: 'English', flag: '🇬🇧' },
+  { code: 'en', name: 'English', Flag: GBFlag },
-  { code: 'de', name: 'Deutsch', flag: '🇩🇪' },
+  { code: 'de', name: 'Deutsch', Flag: DEFlag },
 ];
 
 export const LanguageSelector: React.FC = () => {
@@ -25,7 +44,7 @@ export const LanguageSelector: React.FC = () => {
         className="flex items-center gap-2 px-3 py-2 text-sm font-medium text-neutral-700 bg-white border border-neutral-300 rounded-lg hover:bg-neutral-50 focus:outline-none focus:ring-2 focus:ring-primary-500"
       >
         <Globe className="w-4 h-4" />
-        <span>{currentLanguage.flag}</span>
+        <currentLanguage.Flag className="w-5 h-5" />
         <span>{currentLanguage.name}</span>
       </button>
 
@@ -41,7 +60,7 @@ export const LanguageSelector: React.FC = () => {
                   : 'text-neutral-700'
               }`}
             >
-              <span className="text-lg">{language.flag}</span>
+              <language.Flag className="w-5 h-5" />
               <span>{language.name}</span>
             </button>
           ))}

frontend/src/config/api.ts

@@ -107,7 +107,7 @@ api.interceptors.response.use(
             localStorage.removeItem(`gallery_event_${gallerySlug}`);
           }
           // Don't redirect - let the component handle the auth state
-        } else {
+        } else if (galleryMatch) {
           // We're not on a gallery page but got a 401 from a gallery API
           // This shouldn't happen in normal flow, but if it does, redirect to homepage
           window.location.href = '/';

frontend/src/hooks/useLocalizedDate.ts

@@ -1,17 +1,28 @@
 import { useTranslation } from 'react-i18next';
 import { format as dateFnsFormat, formatDistanceToNow as dateFnsFormatDistanceToNow } from 'date-fns';
 import { de, enUS } from 'date-fns/locale';
+import { useQuery } from '@tanstack/react-query';
+import { settingsService } from '../services/settings.service';
 
 export const useLocalizedDate = () => {
   const { i18n } = useTranslation();
   
+  // Fetch admin settings to get the date format
+  const { data: settings } = useQuery({
+    queryKey: ['admin-settings-general'],
+    queryFn: () => settingsService.getSettingsByType('general'),
+    staleTime: 5 * 60 * 1000, // Cache for 5 minutes
+  });
+  
   const getLocale = () => {
     return i18n.language === 'de' ? de : enUS;
   };
   
-  const format = (date: Date | string, formatStr: string) => {
+  const format = (date: Date | string, formatStr?: string) => {
     const dateObj = typeof date === 'string' ? new Date(date) : date;
-    return dateFnsFormat(dateObj, formatStr, { locale: getLocale() });
+    // Use admin-configured date format if available and no format string provided
+    const dateFormat = formatStr || settings?.general_date_format || 'PPP';
+    return dateFnsFormat(dateObj, dateFormat, { locale: getLocale() });
   };
   
   const formatDistanceToNow = (date: Date | string, options?: { addSuffix?: boolean }) => {
@@ -22,6 +33,7 @@ export const useLocalizedDate = () => {
   return {
     format,
     formatDistanceToNow,
-    locale: getLocale()
+    locale: getLocale(),
+    dateFormat: settings?.general_date_format || 'PPP'
   };
 };

frontend/src/i18n/locales/de.json

@@ -428,6 +428,12 @@
       "requirePassword": "Passwort für alle Galerien erforderlich",
       "minPasswordLength": "Minimale Passwortlänge",
       "minPasswordLengthHelp": "Mindestanzahl von Zeichen für Galerie-Passwörter",
+      "passwordComplexity": "Passwort-Komplexität",
+      "passwordComplexityHelp": "Sicherheitsstufe für Galerie-Passwörter",
+      "complexitySimple": "Einfach (6+ Zeichen, beliebiger Text)",
+      "complexityModerate": "Moderat (8+ Zeichen, Groß-/Kleinschreibung/Zahlen)",
+      "complexityStrong": "Stark (12+ Zeichen, Groß-/Kleinschreibung/Zahlen)",
+      "complexityVeryStrong": "Sehr stark (12+ Zeichen, alle Zeichentypen)",
       "sessionAuth": "Sitzung & Authentifizierung",
       "sessionTimeout": "Sitzungs-Timeout (Minuten)",
       "sessionTimeoutHelp": "Admin-Sitzungs-Timeout in Minuten",
@@ -721,6 +727,12 @@
       "category_deleted": "Kategorie gelöscht: {{categoryName}}",
       "general_settings_updated": "Allgemeine Einstellungen aktualisiert",
       "favicon_uploaded": "Favicon hochgeladen",
+      "analytics_settings_updated": "Analytik-Einstellungen aktualisiert",
+      "cms_page_updated": "CMS-Seite aktualisiert: {{page}}",
+      "security_settings_updated": "Sicherheitseinstellungen aktualisiert",
+      "password_reset": "Passwort zurückgesetzt für: {{eventName}}",
+      "admin_logout": "Admin {{actorName}} abgemeldet",
+      "system_activity": "Systemaktivität: {{type}}",
       "unknown": "Unbekannte Aktivität"
     }
   },

frontend/src/i18n/locales/en.json

@@ -447,6 +447,12 @@
       "requirePassword": "Require password for all galleries",
       "minPasswordLength": "Minimum Password Length",
       "minPasswordLengthHelp": "Minimum number of characters for gallery passwords",
+      "passwordComplexity": "Password Complexity",
+      "passwordComplexityHelp": "Security level required for gallery passwords",
+      "complexitySimple": "Simple (6+ chars, any text)",
+      "complexityModerate": "Moderate (8+ chars, mixed case/numbers)",
+      "complexityStrong": "Strong (12+ chars, uppercase/lowercase/numbers)",
+      "complexityVeryStrong": "Very Strong (12+ chars, all character types)",
       "sessionAuth": "Session & Authentication",
       "sessionTimeout": "Session Timeout (minutes)",
       "sessionTimeoutHelp": "Admin session timeout in minutes",
@@ -796,6 +802,12 @@
       "category_deleted": "Category deleted: {{categoryName}}",
       "general_settings_updated": "General settings updated",
       "favicon_uploaded": "Favicon uploaded",
+      "analytics_settings_updated": "Analytics settings updated",
+      "cms_page_updated": "CMS page updated: {{page}}",
+      "security_settings_updated": "Security settings updated",
+      "password_reset": "Password reset for: {{eventName}}",
+      "admin_logout": "Admin {{actorName}} logged out",
+      "system_activity": "System activity: {{type}}",
       "unknown": "Unknown activity"
     }
   },

frontend/src/pages/GalleryPage.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useParams, Link } from 'react-router-dom';
-import { Calendar, AlertCircle, Clock } from 'lucide-react';
+import { AlertCircle, Clock } from 'lucide-react';
 import { differenceInDays, parseISO } from 'date-fns';
 import { useTranslation } from 'react-i18next';
 import { useLocalizedDate } from '../hooks/useLocalizedDate';
@@ -289,13 +289,9 @@ export const GalleryPage: React.FC = () => {
               alt={settingsData?.branding_company_name || 'PicPeak'}
               className="h-12 sm:h-16 lg:h-20 w-auto object-contain mx-auto mb-3 sm:mb-4"
             />
-            <h1 className="text-xl sm:text-2xl lg:text-3xl font-bold mb-2 px-2" style={{ color: 'var(--color-text, #171717)' }}>
+            <h1 className="text-2xl sm:text-3xl lg:text-4xl font-bold mb-2 px-2" style={{ color: 'var(--color-primary, #5C8762)' }}>
               {galleryInfo?.event_name}
             </h1>
-            <div className="flex items-center justify-center text-xs sm:text-sm" style={{ color: 'var(--color-text, #171717)', opacity: 0.7 }}>
-              <Calendar className="w-3 h-3 sm:w-4 sm:h-4 mr-1" />
-              <span className="truncate">{format(parseISO(galleryInfo!.event_date), 'PP')}</span>
-            </div>
           </div>
 
           {/* Expiration Warning */}

frontend/src/pages/admin/AnalyticsPage.tsx

@@ -17,6 +17,7 @@ import { Button, Card, Loading } from '../../components/common';
 import { useQuery } from '@tanstack/react-query';
 import { adminService } from '../../services/admin.service';
 import { useTranslation } from 'react-i18next';
+import { api } from '../../config/api';
 
 // Map API response to component format
 interface ComponentAnalyticsData {
@@ -53,7 +54,7 @@ export const AnalyticsPage: React.FC = () => {
   const [isEmbedMode, setIsEmbedMode] = useState(false);
   
   // Check if Umami is configured from settings or environment
-  const [umamiConfig, setUmamiConfig] = useState<{ url?: string; shareUrl?: string }>({});
+  const [umamiConfig, setUmamiConfig] = useState<{ url?: string; shareUrl?: string; enabled?: boolean }>({});
 
   // Fetch analytics data from backend
   const { data: apiData, isLoading, refetch } = useQuery({
@@ -71,32 +72,57 @@ export const AnalyticsPage: React.FC = () => {
     queryFn: () => adminService.getDashboardStats(),
   });
 
-  // Fetch public settings to get Umami config
+  // Fetch Umami config from admin settings since we're in admin panel
   useEffect(() => {
     const fetchUmamiConfig = async () => {
       try {
-        const response = await fetch(`${import.meta.env.VITE_API_URL}/api/public/settings`);
+        // Use admin API endpoint with auth token since we're in admin area
-        const settings = await response.json();
+        const response = await api.get('/admin/settings');
+        const settings = response.data;
         
-        if (settings.umami_enabled) {
+        // Transform the settings array to object
+        const settingsMap = settings.reduce((acc: any, setting: any) => {
+          acc[setting.key] = setting.value;
+          return acc;
+        }, {});
+        
+        // Check if Umami is enabled in admin settings
+        if (settingsMap.analytics_umami_enabled && settingsMap.analytics_umami_url && settingsMap.analytics_umami_website_id) {
           setUmamiConfig({
-            url: settings.umami_url,
+            url: settingsMap.analytics_umami_url,
-            shareUrl: settings.umami_share_url
+            shareUrl: settingsMap.analytics_umami_share_url,
+            enabled: true
           });
         } else {
-          // Fall back to environment variables
+          // Fall back to environment variables if they exist
-          setUmamiConfig({
+          const envUrl = import.meta.env.VITE_UMAMI_URL;
-            url: import.meta.env.VITE_UMAMI_URL,
+          const envWebsiteId = import.meta.env.VITE_UMAMI_WEBSITE_ID;
-            shareUrl: import.meta.env.VITE_UMAMI_SHARE_URL
+          
-          });
+          if (envUrl && envWebsiteId) {
+            setUmamiConfig({
+              url: envUrl,
+              shareUrl: import.meta.env.VITE_UMAMI_SHARE_URL,
+              enabled: true
+            });
+          } else {
+            setUmamiConfig({ enabled: false });
+          }
         }
       } catch (error) {
         console.error('Failed to fetch Umami config:', error);
-        // Fall back to environment variables
+        // Fall back to environment variables if they exist
-        setUmamiConfig({
+        const envUrl = import.meta.env.VITE_UMAMI_URL;
-          url: import.meta.env.VITE_UMAMI_URL,
+        const envWebsiteId = import.meta.env.VITE_UMAMI_WEBSITE_ID;
-          shareUrl: import.meta.env.VITE_UMAMI_SHARE_URL
+        
-        });
+        if (envUrl && envWebsiteId) {
+          setUmamiConfig({
+            url: envUrl,
+            shareUrl: import.meta.env.VITE_UMAMI_SHARE_URL,
+            enabled: true
+          });
+        } else {
+          setUmamiConfig({ enabled: false });
+        }
       }
     };
 
@@ -439,7 +465,7 @@ export const AnalyticsPage: React.FC = () => {
       </div>
 
       {/* Configuration Notice */}
-      {!umamiConfig.url && (
+      {umamiConfig.enabled === false && (
         <Card padding="md" className="mt-6 bg-amber-50 border-amber-200">
           <div className="flex items-start gap-3">
             <Activity className="w-5 h-5 text-amber-600 flex-shrink-0" />

frontend/src/pages/admin/CMSPageEnhanced.tsx

@@ -153,13 +153,13 @@ export const CMSPageEnhanced: React.FC = () => {
                       : 'bg-white border border-neutral-200 hover:bg-neutral-50'
                   }`}
                 >
-                  <FileText className="w-5 h-5" />
+                  <FileText className="w-5 h-5 flex-shrink-0" />
-                  <div className="flex-1">
+                  <div className="flex-1 min-w-0">
-                    <p className="font-medium">{t(`legal.${page.slug}`)}</p>
+                    <p className="font-medium truncate">{t(`legal.${page.slug}`)}</p>
                     <p className="text-sm text-neutral-500">/{page.slug}</p>
                   </div>
                   {selectedPage === page.slug && hasUnsavedChanges && (
-                    <div className="w-2 h-2 bg-yellow-500 rounded-full" />
+                    <div className="w-2 h-2 bg-yellow-500 rounded-full flex-shrink-0" />
                   )}
                 </button>
               ))}
@@ -235,7 +235,7 @@ export const CMSPageEnhanced: React.FC = () => {
                       : 'bg-neutral-100 text-neutral-700 hover:bg-neutral-200'
                   }`}
                 >
-                  🇬🇧 English
+                  English
                 </button>
                 <button
                   onClick={() => setEditingLang('de')}
@@ -245,7 +245,7 @@ export const CMSPageEnhanced: React.FC = () => {
                       : 'bg-neutral-100 text-neutral-700 hover:bg-neutral-200'
                   }`}
                 >
-                  🇩🇪 Deutsch
+                  Deutsch
                 </button>
               </div>
             </div>

frontend/src/pages/admin/CreateEventPageEnhanced.tsx

@@ -10,14 +10,14 @@ import {
   Eye,
   EyeOff
 } from 'lucide-react';
-import { format, addDays } from 'date-fns';
+import { addDays } from 'date-fns';
-import { enUS, de } from 'date-fns/locale';
 import { toast } from 'react-toastify';
 
 import { Button, Input, Card } from '../../components/common';
 import { ThemeCustomizerEnhanced, GalleryPreview, WelcomeMessageEditor } from '../../components/admin';
 import { useMutation, useQuery } from '@tanstack/react-query';
 import { eventsService } from '../../services/events.service';
+import { useLocalizedDate } from '../../hooks/useLocalizedDate';
 import { categoriesService } from '../../services/categories.service';
 import { settingsService } from '../../services/settings.service';
 import { useTranslation } from 'react-i18next';
@@ -57,6 +57,7 @@ const EVENT_TYPES = [
 export const CreateEventPageEnhanced: React.FC = () => {
   const navigate = useNavigate();
   const { t, i18n } = useTranslation();
+  const { format } = useLocalizedDate();
   const isMountedRef = useRef(true);
   const [showThemeCustomizer, setShowThemeCustomizer] = useState(false);
   // const [showPreview, setShowPreview] = useState(false);
@@ -499,7 +500,7 @@ export const CreateEventPageEnhanced: React.FC = () => {
               </div>
               {formData.event_date && (
                 <p className="mt-2 text-sm text-neutral-500">
-                  {t('events.expiresOn')}: {format(addDays(new Date(formData.event_date), formData.expires_in_days), 'PPP', { locale: i18n.language === 'de' ? de : enUS })}
+                  {t('events.expiresOn')}: {format(addDays(new Date(formData.event_date), formData.expires_in_days))}
                 </p>
               )}
             </div>

frontend/src/pages/admin/SettingsPage.tsx

@@ -64,6 +64,7 @@ export const SettingsPage: React.FC = () => {
   const [securitySettings, setSecuritySettings] = useState({
     require_password: true,
     password_min_length: 8,
+    password_complexity: 'moderate',
     enable_2fa: false,
     session_timeout_minutes: 60,
     max_login_attempts: 5,
@@ -665,6 +666,25 @@ export const SettingsPage: React.FC = () => {
                   max="32"
                 />
               </div>
+
+              <div>
+                <label className="block text-sm font-medium text-neutral-700 mb-1">
+                  {t('settings.security.passwordComplexity')}
+                </label>
+                <select
+                  value={securitySettings.password_complexity}
+                  onChange={(e) => setSecuritySettings(prev => ({ ...prev, password_complexity: e.target.value }))}
+                  className="w-full px-3 py-2 border border-neutral-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500"
+                >
+                  <option value="simple">{t('settings.security.complexitySimple')}</option>
+                  <option value="moderate">{t('settings.security.complexityModerate')}</option>
+                  <option value="strong">{t('settings.security.complexityStrong')}</option>
+                  <option value="very_strong">{t('settings.security.complexityVeryStrong')}</option>
+                </select>
+                <p className="mt-1 text-sm text-neutral-600">
+                  {t('settings.security.passwordComplexityHelp')}
+                </p>
+              </div>
             </div>
           </Card>