Skip to content

Replace inline site edit with dialog popover - #32

Merged
jasoncrawford merged 9 commits into
mainfrom
site-edit-popover
Feb 21, 2026
Merged

jasoncrawford merged 9 commits into
mainfrom
site-edit-popover

Conversation

@jasoncrawford

Copy link
Copy Markdown
Collaborator

Summary

  • New SiteFormDialog component using native <dialog> for both add and edit flows
  • Centered popover with semi-transparent backdrop (non-dismissive on backdrop click)
  • Delete now requires confirmation (Delete → "Delete? Yes / No")
  • Site detail page uses full "Edit" button instead of pencil icon
  • Removed EditSiteButton component entirely, simplified AddSiteCard

Closes #31

Test plan

  • Unit tests pass (88/88, server actions unchanged)
  • E2E: add site via dialog
  • E2E: edit site via dialog (status page pencil icon)
  • E2E: edit site via dialog (site detail Edit button)
  • E2E: delete site with confirmation
  • E2E: cancel/Escape dismisses dialog
  • All 27 e2e tests pass

🤖 Generated with Claude Code

jasoncrawford and others added 6 commits February 20, 2026 11:48
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Simplify AddSiteCard to just a trigger for the dialog
- Status page pencil icon opens dialog instead of inline edit
- Site detail page uses full Edit button opening dialog
- Delete EditSiteButton.tsx (replaced by SiteFormDialog)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Dialog selectors instead of inline form selectors
- Test Escape key dismissal
- Test delete confirmation flow (Delete → Yes)
- Site detail uses Edit button instead of pencil icon

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- useId() for label/input associations to avoid id collisions
- Use getByRole('button', { name: 'Add site' }) to avoid ambiguity
  with dialog title

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@vercel

vercel Bot commented Feb 20, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
site-status Ready Ready Preview, Comment Feb 21, 2026 5:37am

Request Review

@jasoncrawford

Copy link
Copy Markdown
Collaborator Author

When I try to view the deployment, I get:

500: INTERNAL_SERVER_ERROR
Code: MIDDLEWARE_INVOCATION_FAILED
ID: iad1::lfs4d-1771649921284-83e610f587b9

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@jasoncrawford

Copy link
Copy Markdown
Collaborator Author

The popover is flush with the upper left corner of the view. Can it be centered in the view?

Also the Edit button on the site detail page is very low-contrast, easy to miss.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…Button

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@jasoncrawford
jasoncrawford merged commit 923a5c9 into main Feb 21, 2026
3 checks passed

This branch was successfully deployed

1 active deployment
Preview — 5d57de12 Deployed Feb 21, 2026 by vercel[bot]
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.

Site edit UI should be its own page

1 participant