Skip to content

Custom Dialogs - #117

Merged
mirmirmirr merged 11 commits into
main-previewfrom
custom-dialogs
Apr 9, 2026
Merged

Custom Dialogs#117
mirmirmirr merged 11 commits into
main-previewfrom
custom-dialogs

Conversation

@mirmirmirr

Copy link
Copy Markdown
Contributor

This PR adds custom stylized dialogs to the site. Previously we used the system default. I just changed it so we are now using stylized ones.

Copilot AI review requested due to automatic review settings April 6, 2026 23:34

Copilot AI 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.

Pull request overview

This PR replaces native window.confirm/alert flows with custom stylized dialogs (via Radix Dialog) and wires them into the header actions (reset/import), alongside adding dialog open/close animations.

Changes:

  • Added a reusable Dialog component backed by @radix-ui/react-dialog.
  • Updated header button tray to use custom dialogs for reset/import/error flows and moved import validation/confirmation into the UI.
  • Added global CSS animations for dialog overlay/content transitions.

Reviewed changes

Copilot reviewed 7 out of 8 changed files in this pull request and generated 6 comments.

Show a summary per file
File Description
src/index.css Adds open/close animations for dialog overlay/content.
src/core/workspace/utils/io/useInputOutput.ts Changes importPlan to accept parsed/validated SaveFile data instead of reading a File directly.
src/core/workspace/provider.tsx Removes native confirmation prompt from resetWorkspace (now handled in UI).
src/components/header/HeaderButton.tsx Extracts icon button + tooltip into a reusable header button component.
src/components/header/ButtonTray.tsx Integrates custom dialogs for reset/import/error and performs file parsing + schema validation before import.
src/components/dialog.tsx Introduces the Radix-based dialog implementation (portal, overlay, content, keyboard handling).
package.json Adds @radix-ui/react-dialog dependency.
package-lock.json Lockfile updates for the new dependency and related resolution changes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/components/header/ButtonTray.tsx
Comment thread src/components/dialog.tsx
Comment thread src/components/dialog.tsx
Comment thread src/components/dialog.tsx Outdated
Comment thread src/index.css
Comment thread src/components/header/HeaderButton.tsx
@mirmirmirr
mirmirmirr requested review from liug88 and ramonechen April 7, 2026 18:33

@ramonechen ramonechen 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.

The new custom dialogs look great in my opinion. I think this is fit to be merged.

@mirmirmirr
mirmirmirr merged commit bede53e into main-preview Apr 9, 2026
4 checks passed
@ramonechen
ramonechen deleted the custom-dialogs branch April 13, 2026 18:19
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.

3 participants