Skip to content

fix: not-found state flashes briefly during initial load on detail page #381

Description

@zigzagdev

Problem

useWorldHeritageDetail initializes state as { data: null, loading: false, error: null }.

On the first render, before useEffect fires load(), the container evaluates:

  • isLoading → false
  • isError → false
  • !item → true → renders "Not found."

Then useEffect runs, sets loading: true, and the spinner appears. This causes a visible flash of the not-found state on every page load.

Root cause

useState initial value in use-world-heritage-detail.ts:

loading: false  // should be: loading: id != null

Fix

Change the initial state to loading: id != null so the first render already reflects that a fetch is in flight when an id is present.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions