Skip to content

Add hover previews to calendar events - #2598

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

Add hover previews to calendar events#2598
3mdistal wants to merge 4 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 short hover. 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.
  • 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, 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

  • Exact-head CI at 6d0466f68610d55bef798e5a9e4f06a9ed42e317 completed with 58 successful, 42 skipped, zero failed, and zero pending checks.
  • Calendar tests passed: 52 files and 354 tests, including trigger composition and preview content.
  • Calendar typecheck and production build passed. The build retained the repository's existing 24 non-fatal doctor findings and bundle-size warnings.
  • The Core UI-primitives sync test passed (8 tests), changeset validation passed, and git diff --check passed.
  • Independent browser evidence proved that a real pointer opens the Month side preview and shows the long title, time, location, and attendee summary without an observed console error or failed request. This is partial evidence, not H1 acceptance, because that attempt's unsent fixture lacked a browser-renderable meeting URL.
  • Independent H1-H7 acceptance remains blocked. A later sealed 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?
  • 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 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 6d0466f: 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