Skip to content

Background-logo setting causes SSR hydration mismatch and logo flash #112

Description

@Bidrift

Severity: Medium

backgroundLogo (persisted to localStorage via settings-store.ts:105-111) is read directly during render of the top-level Layout client component (src/components/layout/layout.tsx:40-59), which Next.js still server-renders. Server sees the default sanAndreasSeal; after rehydration it becomes the stored value, so <Image src> differs between server and client.

Impact: React hydration warning + a logo flash for any user who changed the setting.

Fix: Gate on a mounted flag (render default until mounted), or use Zustand persist skipHydration + manual rehydrate.


Filed from a code audit of the current master. Line numbers are approximate.

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