Designations Leak Across Z-Levels And Fail To Render
Why do building labels sometimes appear below the ground floor - like a ghost tile haunting your blueprint? In modern app design, z-levels define layered spaces, but when designation keys ignore target_z, designations bleed into lower levels, confusing users and skewing layouts.
Here’s the real issue: the designatedTiles map treats every tile as a flat (x,y) without z-index awareness. A z=0 building might show at z=-1, breaking spatial logic. This isn’t just a UI glitch - it’s a trust problem.
Psychologically, users expect consistent spatial cues. When a z-level mismatch occurs, it creates cognitive friction: you drag a warehouse, but it doesn’t register until the UI ‘wakes up’ - a delay that’s felt, not just noticed. Think of apps like Blocks by Code or Town Planner: users trust immediate feedback. A lag of two seconds or a z-floating tile breaks that trust.
But here is the catch: after a successful supabase.insert(), most apps wait for the server sync - polling the database - before updating the UI. The result? A 2-second delay in glyph visibility. No optimistic update, no instant preview. Users see static screens while the system stirs - like watching a slow-motion fail.
- Designations ignored z-level context, allowing unintended layer leakage.
- No local state optimization masks real-time changes._local-state updates only after poll round.
- Drag-and-drop actions trigger delayed UI refreshes, hurting workflow fluidity.
- No optimistic UI patching means users gamble on visibility.
- State sync gaps create silent design inconsistencies across device refreshes.
To fix: first, filter designatedTiles to only include target_z === zLevel. Then, implement optimistic local state - temporarily render new designations instantly, syncing later. This keeps the screen responsive and the user in control, not stuck waiting in limbo. The bottom line: in spatial apps, visibility is trust. Never let z-levels hide your work - or your timeline.