fix(dashboard): rework the venue picker dropdown - #453
Merged
Conversation
The popover sized itself to its widest row, so a venue whose address is a Google Maps or Zoom URL stretched the panel across the viewport. Rows now cap at the trigger width and the existing truncation does the rest. Add venue and Create Zoom meeting move out of the scrolling list into a static footer, so both stay reachable however long the venue list gets. Typing something no venue answers to arms Add Manually and Enter takes it, with the typed text carried in as the venue name; the "No results" line is gone, since the armed button already says what happens next. Enter is prevented on the trigger: its default action clicks whatever the dialog focuses as it opens, which closed the dialog again.
Contributor
|
✅ UI Demo Check — a screenshot or demo is attached. |
Contributor
The PR appears safe to merge after addressing the non-blocking venue-loading edge case in the Enter shortcut.
|
| // pre-armed, and Enter takes it. | ||
| const unmatched = computed(() => { | ||
| const text = query.value.trim().toLowerCase() | ||
| return Boolean(text) && !(venues.data ?? []).some((row) => row.name.toLowerCase().includes(text)) |
Contributor
There was a problem hiding this comment.
While the team's venues are still loading, venues.data ?? [] treats the missing data as a completed empty list. Any non-empty query is therefore marked as unmatched, and pressing Enter opens the Add Venue dialog even if that venue already exists. This can lead the organizer into a duplicate-name insert that fails instead of selecting the venue after loading completes. Only arm the shortcut after the venue resource has finished loading.
Knowledge Base Used: Dashboard event management
Prompt To Fix With AI
This is a comment left during a code review.
Path: dashboard/src/components/dashboard/events/EventLocation.vue
Line: 48
Comment:
**Loading Arms Manual Creation**
While the team's venues are still loading, `venues.data ?? []` treats the missing data as a completed empty list. Any non-empty query is therefore marked as unmatched, and pressing Enter opens the Add Venue dialog even if that venue already exists. This can lead the organizer into a duplicate-name insert that fails instead of selecting the venue after loading completes. Only arm the shortcut after the venue resource has finished loading.
**Knowledge Base Used:** [Dashboard event management](https://app.greptile.com/bwh-tech/-/custom-context/knowledge-base/bwhtech/buzz/-/docs/dashboard-event-management.md)
---
For each issue above, determine whether it is valid and should be fixed. If so, fix it directly.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What changed
ZoomLogo.vuewith acolorprop — brand blue by default, grey in the dropdown.space-y-3tospace-y-1.5; the label was floating away from its field.Two things that look odd on purpose:
!justify-startand!bg-surface-gray-3need the!— Button hardcodesjustify-centerandbg-transparent, and there is no class merge.@keydown.enter.prevent. Without.prevent, Enter's default action clicks whatever the dialog focuses as it mounts, and the dialog closes again ~150ms later.The Zoom row stays out of the list but comes back while selected, because the trigger reads its display label from a matching option.
Demo
After
demo-locationui.mp4
Testing
Driven manually in Chromium against the local bench, with the venue list stubbed to long-URL addresses: popover width, static footer, armed Add Manually, Enter with and without a match, and Enter on a matching query still selecting the row.
oxlintandoxfmtpass;vue-tscreports nothing insrc/. No new tests — nothing here is logic worth a test that a screenshot does not already show.