legal documents improved, gäste-pwa uploads optimiert: client-side compression/resize.

resources/js/guest/services/photosApi.ts

@@ -90,49 +90,117 @@ export async function likePhoto(id: number): Promise<number> {
   return json.likes_count ?? json.data?.likes_count ?? 0;
 }
 
-export async function uploadPhoto(eventToken: string, file: File, taskId?: number, emotionSlug?: string): Promise<number> {
+type UploadOptions = {
+  onProgress?: (percent: number) => void;
+  signal?: AbortSignal;
+  maxRetries?: number;
+  onRetry?: (attempt: number) => void;
+};
+
+export async function uploadPhoto(
+  eventToken: string,
+  file: File,
+  taskId?: number,
+  emotionSlug?: string,
+  options: UploadOptions = {}
+): Promise<number> {
   const formData = new FormData();
-  formData.append('photo', file, `photo-${Date.now()}.jpg`);
+  formData.append('photo', file, file.name || `photo-${Date.now()}.jpg`);
   if (taskId) formData.append('task_id', taskId.toString());
   if (emotionSlug) formData.append('emotion_slug', emotionSlug);
   formData.append('device_id', getDeviceId());
 
-  const res = await fetch(`/api/v1/events/${encodeURIComponent(eventToken)}/upload`, {
-    method: 'POST',
-    credentials: 'include',
-    body: formData,
-    // Don't set Content-Type for FormData - let browser handle it with boundary
-  });
+  const maxRetries = options.maxRetries ?? 2;
+  const url = `/api/v1/events/${encodeURIComponent(eventToken)}/upload`;
+  const headers = getCsrfHeaders();
 
-  if (!res.ok) {
-    let payload: any = null;
+  const attemptUpload = (attempt: number): Promise<any> =>
+    new Promise((resolve, reject) => {
+      const xhr = new XMLHttpRequest();
+      xhr.open('POST', url, true);
+      xhr.withCredentials = true;
+      xhr.responseType = 'json';
+
+      Object.entries(headers).forEach(([key, value]) => {
+        xhr.setRequestHeader(key, value);
+      });
+
+      if (options.signal) {
+        const onAbort = () => xhr.abort();
+        options.signal.addEventListener('abort', onAbort, { once: true });
+      }
+
+      xhr.upload.onprogress = (event) => {
+        if (event.lengthComputable && options.onProgress) {
+          const percent = Math.min(99, Math.round((event.loaded / event.total) * 100));
+          options.onProgress(percent);
+        }
+      };
+
+      xhr.onload = () => {
+        const status = xhr.status;
+        const payload = xhr.response ?? null;
+
+        if (status >= 200 && status < 300) {
+          resolve(payload);
+          return;
+        }
+
+        const error: UploadError = new Error(
+          payload?.error?.message ?? `Upload failed: ${status}`
+        );
+        error.code = payload?.error?.code ?? (status === 0 ? 'network_error' : 'upload_failed');
+        error.status = status;
+        if (payload?.error?.meta) {
+          error.meta = payload.error.meta as Record<string, unknown>;
+        }
+        reject(error);
+      };
+
+      xhr.onerror = () => {
+        const error: UploadError = new Error('Network error during upload');
+        error.code = 'network_error';
+        reject(error);
+      };
+
+      xhr.ontimeout = () => {
+        const error: UploadError = new Error('Upload timed out');
+        error.code = 'timeout';
+        reject(error);
+      };
+
+      xhr.send(formData);
+    });
+
+  for (let attempt = 0; attempt <= maxRetries; attempt++) {
     try {
-      payload = await res.clone().json();
-    } catch {}
+      const json = await attemptUpload(attempt + 1);
+      return json?.photo_id ?? json?.id ?? json?.data?.id ?? 0;
+    } catch (error) {
+      const err = error as UploadError;
 
-    if (res.status === 419) {
-      const csrfError: UploadError = new Error(
-        'CSRF token mismatch during upload. Please refresh the page and try again.'
-      );
-      csrfError.code = 'csrf_mismatch';
-      csrfError.status = res.status;
-      throw csrfError;
+      if (attempt < maxRetries && (err.code === 'network_error' || (err.status ?? 0) >= 500)) {
+        options.onRetry?.(attempt + 1);
+        const delay = 300 * (attempt + 1);
+        await new Promise((resolve) => setTimeout(resolve, delay));
+        continue;
+      }
+
+      // Map CSRF mismatch specifically for caller handling
+      if ((err.status ?? 0) === 419) {
+        err.code = 'csrf_mismatch';
+      }
+
+      // Flag common validation failure for file size/validation
+      if ((err.status ?? 0) === 422 && !err.code) {
+        err.code = 'validation_error';
+      }
+
+      throw err;
     }
-
-    const error: UploadError = new Error(
-      payload?.error?.message ?? `Upload failed: ${res.status}`
-    );
-    error.code = payload?.error?.code ?? 'upload_failed';
-    error.status = res.status;
-    if (payload?.error?.meta) {
-      error.meta = payload.error.meta as Record<string, unknown>;
-    }
-
-    throw error;
   }
 
-  const json = await res.json();
-  return json.photo_id ?? json.id ?? json.data?.id ?? 0;
+  throw new Error('Upload failed after retries');
 }
 
 export async function createPhotoShareLink(eventToken: string, photoId: number): Promise<{ slug: string; url: string; expires_at?: string }> {