diff --git a/resources/js/admin/i18n/locales/de/management.json b/resources/js/admin/i18n/locales/de/management.json index ea49a17..c98aff3 100644 --- a/resources/js/admin/i18n/locales/de/management.json +++ b/resources/js/admin/i18n/locales/de/management.json @@ -178,6 +178,7 @@ "all": "Alle", "loadMore": "Mehr laden", "processing": "Verarbeite …", + "select": "Auswählen", "close": "Schließen", "reset": "Zurücksetzen" }, diff --git a/resources/js/admin/i18n/locales/en/management.json b/resources/js/admin/i18n/locales/en/management.json index a4f9e11..f261c3c 100644 --- a/resources/js/admin/i18n/locales/en/management.json +++ b/resources/js/admin/i18n/locales/en/management.json @@ -174,6 +174,7 @@ "all": "All", "loadMore": "Load more", "processing": "Processing…", + "select": "Select", "close": "Close", "reset": "Reset" }, diff --git a/resources/js/admin/mobile/EventPhotosPage.tsx b/resources/js/admin/mobile/EventPhotosPage.tsx index 609d6bd..f63573c 100644 --- a/resources/js/admin/mobile/EventPhotosPage.tsx +++ b/resources/js/admin/mobile/EventPhotosPage.tsx @@ -98,6 +98,11 @@ export default function MobileEventPhotosPage() { const surface = String(theme.surface?.val ?? '#ffffff'); const backdrop = String(theme.gray12?.val ?? '#0f172a'); + const basePhotosPath = slug ? adminPath(`/mobile/events/${slug}/photos`) : adminPath('/mobile/events'); + const photoQuery = React.useMemo(() => { + return new URLSearchParams(location.search).get('photo'); + }, [location.search]); + const sourcePhotoParam = photoQuery ?? photoIdParam ?? null; const lightboxIndex = React.useMemo(() => { if (lightboxId === null) { return -1; @@ -106,12 +111,12 @@ export default function MobileEventPhotosPage() { }, [photos, lightboxId]); const lightbox = lightboxIndex >= 0 ? photos[lightboxIndex] : null; const parsedPhotoId = React.useMemo(() => { - if (!photoIdParam) { + if (!sourcePhotoParam) { return null; } - const parsed = Number(photoIdParam); + const parsed = Number(sourcePhotoParam); return Number.isFinite(parsed) ? parsed : null; - }, [photoIdParam]); + }, [sourcePhotoParam]); React.useEffect(() => { if (lightboxId !== null && lightboxIndex === -1 && !loading && pendingPhotoId !== lightboxId) { @@ -144,7 +149,8 @@ export default function MobileEventPhotosPage() { }, [lightbox]); React.useEffect(() => { - if (!photoIdParam) { + if (!sourcePhotoParam) { + setLightboxId(null); setPendingPhotoId(null); return; } @@ -156,7 +162,7 @@ export default function MobileEventPhotosPage() { setLightboxId(parsedPhotoId); setPendingPhotoId(parsedPhotoId); - }, [parsedPhotoId, photoIdParam]); + }, [parsedPhotoId, sourcePhotoParam]); React.useEffect(() => { if (slugParam && activeEvent?.slug !== slugParam) { @@ -333,9 +339,26 @@ export default function MobileEventPhotosPage() { } }, [online, syncQueuedActions]); - const setLightboxWithUrl = React.useCallback((photoId: number | null) => { - setLightboxId(photoId); - }, []); + const setLightboxWithUrl = React.useCallback( + (photoId: number | null) => { + setLightboxId(photoId); + if (typeof window === 'undefined' || !slug) { + return; + } + const params = new URLSearchParams(window.location.search); + if (photoId) { + params.set('photo', String(photoId)); + } else { + params.delete('photo'); + } + const nextSearch = params.toString(); + const nextPath = `${basePhotosPath}${nextSearch ? `?${nextSearch}` : ''}`; + if (`${window.location.pathname}${window.location.search}` !== nextPath) { + window.history.replaceState(null, '', nextPath); + } + }, + [basePhotosPath, slug], + ); const handleModerationAction = React.useCallback( async (action: PhotoModerationAction['action'], photo: TenantPhoto) => { @@ -641,23 +664,6 @@ export default function MobileEventPhotosPage() { onBack={back} headerActions={ - { - if (selectionMode) { - clearSelection(); - } else { - setSelectionMode(true); - } - }} - ariaLabel={selectionMode ? t('common.done', 'Done') : t('common.select', 'Select')} - > - - {selectionMode ? t('common.done', 'Done') : t('common.select', 'Select')} - - - setShowFilters(true)} ariaLabel={t('mobilePhotos.filtersTitle', 'Filter')}> - - load()} ariaLabel={t('common.refresh', 'Refresh')}> @@ -707,6 +713,27 @@ export default function MobileEventPhotosPage() { ) : null} + + { + if (selectionMode) { + clearSelection(); + } else { + setSelectionMode(true); + } + }} + /> + setShowFilters(true)} + /> + +