Aufgabenkarten in der Gäste-pwa als swipe-barer Stapel umgesetzt. Sofortiges Freigeben von Foto-Uploads als Event-Einstellung implementiert.

2025-12-16 15:30:52 +01:00
parent f2473c6f6d
commit 9e4e9a0d87
19 changed files with 22590 additions and 21687 deletions
--- a/resources/js/admin/mobile/EventFormPage.tsx
+++ b/resources/js/admin/mobile/EventFormPage.tsx
@@ -19,6 +19,7 @@ type FormState = {
  description: string;
  location: string;
  published: boolean;
+  autoApproveUploads: boolean;
 };

 export default function MobileEventFormPage() {
@@ -35,6 +36,7 @@ export default function MobileEventFormPage() {
    description: '',
    location: '',
    published: false,
+    autoApproveUploads: true,
  });
  const [eventTypes, setEventTypes] = React.useState<TenantEventType[]>([]);
  const [typesLoading, setTypesLoading] = React.useState(false);
@@ -55,6 +57,8 @@ export default function MobileEventFormPage() {
          description: typeof data.description === 'string' ? data.description : '',
          location: resolveLocation(data),
          published: data.status === 'published',
+          autoApproveUploads:
+            (data.settings?.guest_upload_visibility as string | undefined) === 'immediate',
        });
        setError(null);
      } catch (err) {
@@ -88,24 +92,30 @@ export default function MobileEventFormPage() {
  async function handleSubmit() {
    setSaving(true);
    setError(null);
-    try {
-      if (isEdit && slug) {
-        await updateEvent(slug, {
-          name: form.name,
-          event_date: form.date || undefined,
-          event_type_id: form.eventTypeId ?? undefined,
-          status: form.published ? 'published' : 'draft',
-          settings: { location: form.location },
-        });
-        navigate(adminPath(`/mobile/events/${slug}`));
-      } else {
-        const payload = {
-          name: form.name || t('eventForm.fields.name.fallback', 'Event'),
+      try {
+        if (isEdit && slug) {
+          await updateEvent(slug, {
+            name: form.name,
+            event_date: form.date || undefined,
+            event_type_id: form.eventTypeId ?? undefined,
+            status: form.published ? 'published' : 'draft',
+            settings: {
+              location: form.location,
+              guest_upload_visibility: form.autoApproveUploads ? 'immediate' : 'review',
+            },
+          });
+          navigate(adminPath(`/mobile/events/${slug}`));
+        } else {
+          const payload = {
+            name: form.name || t('eventForm.fields.name.fallback', 'Event'),
          slug: `${Date.now()}`,
          event_type_id: form.eventTypeId ?? undefined,
          event_date: form.date || undefined,
          status: (form.published ? 'published' : 'draft') as const,
-          settings: { location: form.location },
+          settings: {
+            location: form.location,
+            guest_upload_visibility: form.autoApproveUploads ? 'immediate' : 'review',
+          },
        };
        const { event } = await createEvent(payload as any);
        navigate(adminPath(`/mobile/events/${event.slug}`));
@@ -217,6 +227,37 @@ export default function MobileEventFormPage() {
          </XStack>
          <Text fontSize="$xs" color="#6b7280">{t('eventForm.fields.publish.help', 'Enable if guests should see the event right away. You can change the status later.')}</Text>
        </Field>
+
+        <Field label={t('eventForm.fields.uploadVisibility.label', 'Uploads visible immediately')}>
+          <XStack alignItems="center" space="$2">
+            <Switch
+              checked={form.autoApproveUploads}
+              onCheckedChange={(checked) =>
+                setForm((prev) => ({ ...prev, autoApproveUploads: Boolean(checked) }))
+              }
+              size="$3"
+              aria-label={t('eventForm.fields.uploadVisibility.label', 'Uploads visible immediately')}
+            >
+              <Switch.Thumb />
+            </Switch>
+            <Text fontSize="$sm" color="#111827">
+              {form.autoApproveUploads
+                ? t('common:states.enabled', 'Enabled')
+                : t('common:states.disabled', 'Disabled')}
+            </Text>
+          </XStack>
+          <Text fontSize="$xs" color="#6b7280">
+            {form.autoApproveUploads
+              ? t(
+                  'eventForm.fields.uploadVisibility.helpOn',
+                  'Neue Gast-Uploads erscheinen sofort in der Galerie (Security-Scan läuft im Hintergrund).',
+                )
+              : t(
+                  'eventForm.fields.uploadVisibility.helpOff',
+                  'Uploads werden zunächst geprüft und erscheinen nach Freigabe.',
+                )}
+          </Text>
+        </Field>
      </MobileCard>

      <YStack space="$2">
--- a/resources/js/admin/mobile/EventPhotosPage.tsx
+++ b/resources/js/admin/mobile/EventPhotosPage.tsx
@@ -12,6 +12,7 @@ import {
  updatePhotoVisibility,
  featurePhoto,
  unfeaturePhoto,
+  updatePhotoStatus,
  TenantPhoto,
  EventAddonCatalogItem,
  createEventAddonCheckout,
@@ -30,7 +31,7 @@ import { buildLimitWarnings } from '../lib/limitWarnings';
 import { adminPath } from '../constants';
 import { scopeDefaults, selectAddonKeyForScope } from './addons';

-type FilterKey = 'all' | 'featured' | 'hidden';
+type FilterKey = 'all' | 'featured' | 'hidden' | 'pending';

 export default function MobileEventPhotosPage() {
  const { slug: slugParam } = useParams<{ slug?: string }>();
@@ -92,12 +93,18 @@ export default function MobileEventPhotosPage() {
    setLoading(true);
    setError(null);
    try {
+      const status =
+        filter === 'hidden' || onlyHidden
+          ? 'hidden'
+          : filter === 'pending'
+            ? 'pending'
+            : undefined;
      const result = await getEventPhotos(slug, {
        page,
        perPage: 20,
        sort: 'desc',
        featured: filter === 'featured' || onlyFeatured,
-        status: filter === 'hidden' || onlyHidden ? 'hidden' : undefined,
+        status,
        search: search || undefined,
      });
      setPhotos((prev) => (page === 1 ? result.photos : [...prev, ...result.photos]));
@@ -184,6 +191,24 @@ export default function MobileEventPhotosPage() {
    }
  }

+  async function approvePhoto(photo: TenantPhoto) {
+    if (!slug) return;
+    setBusyId(photo.id);
+    try {
+      const updated = await updatePhotoStatus(slug, photo.id, 'approved');
+      setPhotos((prev) => prev.map((p) => (p.id === photo.id ? updated : p)));
+      setLightbox((prev) => (prev && prev.id === photo.id ? updated : prev));
+      toast.success(t('mobilePhotos.approveSuccess', 'Photo approved'));
+    } catch (err) {
+      if (!isAuthError(err)) {
+        setError(getApiErrorMessage(err, t('mobilePhotos.approveFailed', 'Freigabe fehlgeschlagen.')));
+        toast.error(t('mobilePhotos.approveFailed', 'Freigabe fehlgeschlagen.'));
+      }
+    } finally {
+      setBusyId(null);
+    }
+  }
+
  return (
    <MobileShell
      activeTab="uploads"
@@ -219,8 +244,8 @@ export default function MobileEventPhotosPage() {
        style={{ ...baseInputStyle, marginBottom: 12 }}
      />

-      <XStack space="$2">
-        {(['all', 'featured', 'hidden'] as FilterKey[]).map((key) => (
+      <XStack space="$2" flexWrap="wrap">
+        {(['all', 'featured', 'pending', 'hidden'] as FilterKey[]).map((key) => (
          <Pressable key={key} onPress={() => setFilter(key)} style={{ flex: 1 }}>
            <MobileCard
              backgroundColor={filter === key ? infoBg : surface}
@@ -232,7 +257,9 @@ export default function MobileEventPhotosPage() {
                  ? t('common.all', 'All')
                  : key === 'featured'
                    ? t('photos.filters.featured', 'Featured')
-                    : t('photos.filters.hidden', 'Hidden')}
+                    : key === 'pending'
+                      ? t('photos.filters.pending', 'Pending')
+                      : t('photos.filters.hidden', 'Hidden')}
              </Text>
            </MobileCard>
          </Pressable>
@@ -283,6 +310,9 @@ export default function MobileEventPhotosPage() {
                  />
                  <XStack position="absolute" top={6} left={6} space="$1">
                    {photo.is_featured ? <PillBadge tone="warning">{t('photos.filters.featured', 'Featured')}</PillBadge> : null}
+                    {photo.status === 'pending' ? (
+                      <PillBadge tone="warning">{t('photos.filters.pending', 'Pending')}</PillBadge>
+                    ) : null}
                    {photo.status === 'hidden' ? <PillBadge tone="muted">{t('photos.filters.hidden', 'Hidden')}</PillBadge> : null}
                  </XStack>
                </YStack>
@@ -317,8 +347,25 @@ export default function MobileEventPhotosPage() {
              <XStack space="$2" alignItems="center">
                <PillBadge tone="muted">{lightbox.uploader_name || t('events.members.roles.guest', 'Guest')}</PillBadge>
                <PillBadge tone="muted">❤️ {lightbox.likes_count ?? 0}</PillBadge>
+                {lightbox.status === 'pending' ? (
+                  <PillBadge tone="warning">{t('photos.filters.pending', 'Pending')}</PillBadge>
+                ) : null}
+                {lightbox.status === 'hidden' ? (
+                  <PillBadge tone="muted">{t('photos.filters.hidden', 'Hidden')}</PillBadge>
+                ) : null}
              </XStack>
              <XStack space="$2" flexWrap="wrap">
+                {lightbox.status === 'pending' ? (
+                  <CTAButton
+                    label={
+                      busyId === lightbox.id
+                        ? t('common.processing', '...')
+                        : t('photos.actions.approve', 'Approve')
+                    }
+                    onPress={() => approvePhoto(lightbox)}
+                    style={{ flex: 1, minWidth: 140 }}
+                  />
+                ) : null}
                <CTAButton
                  label={
                    busyId === lightbox.id