soeren/fotospiel-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Avoid hidden gallery content on tab navigation

Browse Source
This commit is contained in:
Codex Agent
2026-01-14 11:36:02 +01:00
parent 9506affdc3
commit 736ea322dd
1 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
resources/js/guest/pages/GalleryPage.tsx
View File

@@ -1,7 +1,7 @@
// @ts-nocheck // @ts-nocheck
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Page } from './_util'; import { Page } from './_util';
import { useParams, useSearchParams } from 'react-router-dom'; import { useNavigationType, useParams, useSearchParams } from 'react-router-dom';
import { usePollGalleryDelta } from '../polling/usePollGalleryDelta'; import { usePollGalleryDelta } from '../polling/usePollGalleryDelta';
import FiltersBar, { type GalleryFilter } from '../components/FiltersBar'; import FiltersBar, { type GalleryFilter } from '../components/FiltersBar';
import { Heart, Image as ImageIcon, Share2 } from 'lucide-react'; import { Heart, Image as ImageIcon, Share2 } from 'lucide-react';
@@ -16,7 +16,7 @@ import { createPhotoShareLink } from '../services/photosApi';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
import { useEventBranding } from '../context/EventBrandingContext'; import { useEventBranding } from '../context/EventBrandingContext';
import ShareSheet from '../components/ShareSheet'; import ShareSheet from '../components/ShareSheet';
import { FADE_SCALE, FADE_UP, STAGGER_FAST, getMotionContainerProps, getMotionItemProps, prefersReducedMotion } from '../lib/motion'; import { FADE_SCALE, FADE_UP, STAGGER_FAST, getMotionContainerPropsForNavigation, getMotionItemProps, prefersReducedMotion } from '../lib/motion';
import PullToRefresh from '../components/PullToRefresh'; import PullToRefresh from '../components/PullToRefresh';
import { triggerHaptic } from '../lib/haptics'; import { triggerHaptic } from '../lib/haptics';
@@ -56,6 +56,7 @@ const normalizeImageUrl = (src?: string | null) => {
export default function GalleryPage() { export default function GalleryPage() {
const { token } = useParams<{ token?: string }>(); const { token } = useParams<{ token?: string }>();
const navigationType = useNavigationType();
const { t, locale } = useTranslation(); const { t, locale } = useTranslation();
const { branding } = useEventBranding(); const { branding } = useEventBranding();
const { photos, loading, newCount, acknowledgeNew, refreshNow } = usePollGalleryDelta(token ?? '', locale); const { photos, loading, newCount, acknowledgeNew, refreshNow } = usePollGalleryDelta(token ?? '', locale);
@@ -68,10 +69,10 @@ export default function GalleryPage() {
const bodyFont = branding.typography?.body ?? branding.fontFamily ?? undefined; const bodyFont = branding.typography?.body ?? branding.fontFamily ?? undefined;
const headingFont = branding.typography?.heading ?? branding.fontFamily ?? undefined; const headingFont = branding.typography?.heading ?? branding.fontFamily ?? undefined;
const motionEnabled = !prefersReducedMotion(); const motionEnabled = !prefersReducedMotion();
const containerMotion = getMotionContainerProps(motionEnabled, STAGGER_FAST); const containerMotion = getMotionContainerPropsForNavigation(motionEnabled, STAGGER_FAST, navigationType);
const fadeUpMotion = getMotionItemProps(motionEnabled, FADE_UP); const fadeUpMotion = getMotionItemProps(motionEnabled, FADE_UP);
const fadeScaleMotion = getMotionItemProps(motionEnabled, FADE_SCALE); const fadeScaleMotion = getMotionItemProps(motionEnabled, FADE_SCALE);
const gridMotion = getMotionContainerProps(motionEnabled, STAGGER_FAST); const gridMotion = getMotionContainerPropsForNavigation(motionEnabled, STAGGER_FAST, navigationType);
const [filter, setFilterState] = React.useState<GalleryFilter>('latest'); const [filter, setFilterState] = React.useState<GalleryFilter>('latest');
const [currentPhotoIndex, setCurrentPhotoIndex] = React.useState<number | null>(null); const [currentPhotoIndex, setCurrentPhotoIndex] = React.useState<number | null>(null);
const [hasOpenedPhoto, setHasOpenedPhoto] = useState(false); const [hasOpenedPhoto, setHasOpenedPhoto] = useState(false);