Skip to content

Add hover previews to calendar events - #2598

Draft
3mdistal wants to merge 5 commits into
mainfrom
codex/calendar-event-hover-previews
Draft

Add hover previews to calendar events#2598
3mdistal wants to merge 5 commits into
mainfrom
codex/calendar-event-hover-previews

Conversation

@3mdistal

@3mdistal 3mdistal commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

Problem

Calendar's compact Month and Week event cards often hide the context needed to recognize or join an event. Opening full details works, but it is heavier than a quick glance and interrupts scanning a dense calendar.

Approach

Add a small, read-only preview beside an individual event after a brief hover-intent pause. The preview is layered over the calendar instead of resizing or moving events, while existing full-detail, drag, and resize behavior remains authoritative.

This deliberately applies only to ordinary Month and Week events. Day already has richer inline cards, and status-event lanes keep their existing rendering.

What changed

  • Added a portaled event preview with title, time, optional location, attendee summary, and existing meeting access.
  • Reduced hover intent from 150 ms to 50 ms and matched the app's overlay cadence: 150 ms opening, 100 ms closing, with reduced-motion behavior preserved.
  • Preferred right-side placement with collision-aware flipping to the left and a visible source halo.
  • Suppressed or closed the preview during pointer-down, drag, resize, and full-detail interactions.
  • Shared meeting-link detection between the preview and full details.
  • Made EventCard forward native button props and refs so overlay triggers compose with the real event control.
  • Exported the Hover Card portal from Toolkit, restored Calendar's one-line Toolkit adapter, and added the required Toolkit changeset.
  • Added focused preview, timing, trigger-composition, meeting-link, and detail-popover coverage, plus a Calendar changelog entry.

Safety and operations

This is a presentation change with no schema, action, route, authentication, credential, or stored-data migration. Reverting the preview wrapper restores the previous UI. The Toolkit change is an additive export covered by a patch changeset.

Verification

  • Current head 1761867b305f66c16bd54e4e88143e07f440494b: focused hover-preview tests passed (2 tests), Calendar typecheck passed, formatting passed, and git diff --check passed.
  • Local browser review on the current head used 22 disposable events across a dense August Month and a fully populated Week. A real pointer opened a varied Week-event preview within the shortened timing window; Month and Week both rendered the expanded fixture set with no observed console warning or error. This is implementer visual evidence, not independent acceptance.
  • Previous head 6d0466f68610d55bef798e5a9e4f06a9ed42e317: CI completed with 58 successful, 42 skipped/neutral, zero failed, and zero pending checks; Calendar's full suite passed 52 files and 354 tests; production build, Core UI-primitives sync, and changeset validation passed.
  • Fresh full CI for the current timing head is pending.
  • Independent H1-H7 acceptance remains blocked. The last sealed tester capsule proved the corrected fixture exposes Join Meet, but the tester's context-local browser tab disappeared between the short turns needed to finish bootstrap and begin H1 (Existing tabs: none). H2-H7 were not executed, and no implementer interaction is being substituted.

Review focus

  • Does EventDetailPopover preserve existing click/sidebar behavior while isolating hover state?
  • Does the 50 ms intent delay feel immediate without making incidental pointer travel noisy, while the 100 ms close grace still permits entering the preview?
  • Are drag, resize, pointer-down, and full-detail suppression paths sufficient to prevent stale previews or accidental clicks?
  • Is side-only collision behavior calm and legible for dense Month and Week layouts?
  • Is the additive Toolkit portal export the correct ownership boundary for Calendar's adapter?

Required before readiness

  • Complete fresh CI on the current head.
  • Complete frozen independent H1-H7 browser acceptance in one uninterrupted browser session or on a browser surface whose tab persists across test turns.
  • Year view remains a later product decision; Calendar does not currently expose that view mode.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

@github-actions

github-actions Bot commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

Visual recap — skipped

The visual recap job did not run for this pull request. This is informational only and does not block the PR.

Recap skipped for 1761867: draft PR.

@builder-io-integration builder-io-integration Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Builder reviewed your changes — looks good ✅

Review Details

Code Review Summary

PR #2598 adds a localized, read-only hover preview around ordinary Month and Week calendar events while retaining the existing EventDetailPopover as the authoritative click/details path. The implementation cleanly separates meeting-link extraction, forwards trigger props and refs through EventCard, uses a portaled Radix HoverCard with collision-aware side placement, and explicitly suppresses the preview for mobile, working-location/out-of-office events, pointer-down, and parent drag state. The added unit coverage exercises trigger composition, metadata rendering, attendee truncation, meeting-link selection, and location deduplication.

Risk assessment: Standard (UI interaction/state behavior with a shared event utility, but no auth, data, route, or schema changes).

No confirmed actionable bugs were found after comparing the parallel reviews. One agent flagged the pointer listener cleanup, but removeEventListener matching depends on the capture flag, not the once option, so the current cleanup is valid. Another flagged the pointerover test event, but React's pointer-enter synthetic event is delegated from pointerover, so that test is intentional and valid.

✅ Good patterns: existing detail behavior remains authoritative; preview state is isolated; meeting-link logic is shared rather than duplicated; portal rendering avoids calendar layout shifts; interaction suppression covers the main drag/detail paths.

🧪 Browser testing: Attempted after the review; all planned Calendar flows were blocked because browser-testing executors had no Chrome automation tools available, despite retry. No browser behavior was claimed as verified.

@3mdistal
3mdistal marked this pull request as draft August 3, 2026 18:39
@netlify

This comment has been minimized.

@netlify

This comment has been minimized.

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant