Bug: Brief Flash of AI Tagging Page When Navigating to a Person's Images from the Search Bar

[rohan-pandeyy]

What happens

When a face cluster avatar is clicked in the Navbar search panel, the app navigates to /person/:clusterId. Before PersonImages fully renders, there is a brief visible flash of the /ai-tagging page.

This does not happen when navigating to a person from within the AI Tagging page itself.

Steps to reproduce

1. Open the app on any page other than /ai-tagging (e.g. Home)
2. Click the search bar to expand the search panel
3. Click any face cluster avatar chip (this requires one or more folders with images with AI Tagging toggled ON in settings.)
4. Observe a brief flash of the AI Tagging page before the person's images load

Expected behaviour

Navigating to /person/:clusterId renders PersonImages directly with no intermediate page flash.

Root cause (hypothesis)

PersonImages likely checks whether the target cluster exists in state.faceClusters.clusters. If the slice is still empty when the component mounts (i.e. clusters haven't been fetched yet on this session), it redirects to /ai-tagging, causing the flash.

The fix should be scoped to PersonImages.tsx: the redirect to /ai-tagging should only fire if the clusters array is non-empty and the cluster ID is genuinely absent. If the array is still empty (data not yet loaded), the component should wait rather than redirect.

// Before
if (!currentCluster) navigate('/ai-tagging');

// After
if (clusters.length > 0 && !currentCluster) navigate('/ai-tagging');

[tanmaysachann]

Hi @rohan-pandeyy, I'd like to take this one. I dug into it on the latest main and wanted to check my understanding with you before starting, since what I found differs a bit from the hypothesis in the issue.

I couldn't find the redirect described (PersonImages reading faceClusters.clusters and calling navigate('/ai-tagging') when the slice is empty). In the current code, PersonImages only navigates to AI Tagging via the user-clicked "Back to AI Tagging" button, and it never reads the clusters slice. Its git history doesn't show that guard ever existing either, so I may just be looking at it differently than you were.

What I can reproduce is a stale-state render: PersonImages renders its grid from the shared images slice (selectImages) on mount, and only replaces it after fetchClusterImages resolves. So for the first frame it shows whatever the previous page left in that slice, and the global loader overlay then masks it, which matches the brief flash. Adding a temporary delay to the cluster-images query makes it clearly visible: the previous page's images stay on screen until the person's photos load.

Could you confirm whether this matches what you saw, especially your repro starting from Home? I want to make sure I'm fixing the same thing. My proposed fix would be to stop PersonImages from rendering the shared images while its own query is loading (render a skeleton/empty grid instead) and scope the images to the active clusterId. Happy to be assigned if that sounds right.

[VanshajPoonia]

Agreed with @tanmaysachann's read - I dug into this independently on main and it's the stale shared images slice, not a redirect (nothing calls navigate('/ai-tagging') on mount; only the "Back" button does). Two things I can add on top:

Why it doesn't flash from AI Tagging: when you arrive from there the shared slice holds the tagged images (fetchAllImages(true)), and a person's photos are a subset of that set, so the stale first frame already contains them and the swap is invisible. From Home the slice is the full gallery, so the change is visible. That's exactly the "doesn't happen from AI Tagging" behaviour in the issue, and it lines up with the shared-slice theory rather than the redirect one.

One thing to get right in the fix: rendering a skeleton "while the query is loading" handles a cold mount, but not person A → person B when B is already cached — there isLoading is false immediately while the slice still holds A's images for a tick, so it'd still flash. Deriving the grid straight from the ['person-images', clusterId] query data (which React Query already scopes to the active id) covers both cases without leaning on a loading flag.

Happy to take this and put up the PR.
@rohan-pandeyy

[rohan-pandeyy]

Great, thanks for the initiative, both of you.

I’ll be assigning this issue to @tanmaysachann, as he was the first to express interest in working on it.

@VanshajPoonia, your initiative is appreciated as well. It would be great if you could help by reviewing the pull request once Tanmay submits it.

I’m currently out of town, so the merge may take a day or two. Thanks for your patience.