[PR #23783] feat: add highPriority option to Modal for goto-anything layering #30395

Closed
opened 2026-02-21 20:47:25 -05:00 by yindo · 0 comments
Owner

Original Pull Request: https://github.com/langgenius/dify/pull/23783

State: closed
Merged: Yes


Summary

Fixes #23782

This PR adds an optional highPriority prop to the Modal component to resolve z-index layering conflicts. The goto-anything modal now uses high priority layering to ensure it appears above dropdown components.

The solution maintains backward compatibility by making the highPriority prop optional with a default value of false. Only critical modals like the global command palette use the high priority option.

Screenshots

Before After
Modal appears behind dropdowns
image
Modal correctly overlays all dropdowns
image

Checklist

  • This change requires a documentation update, included: Dify Document
  • I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!)
  • I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change.
  • I've updated the documentation accordingly.
  • I ran dev/reformat(backend) and cd web && npx lint-staged(frontend) to appease the lint gods
**Original Pull Request:** https://github.com/langgenius/dify/pull/23783 **State:** closed **Merged:** Yes --- ## Summary Fixes #23782 This PR adds an optional highPriority prop to the Modal component to resolve z-index layering conflicts. The goto-anything modal now uses high priority layering to ensure it appears above dropdown components. The solution maintains backward compatibility by making the highPriority prop optional with a default value of false. Only critical modals like the global command palette use the high priority option. ## Screenshots | Before | After | |--------|-------| | Modal appears behind dropdowns <img width="995" height="640" alt="image" src="https://github.com/user-attachments/assets/4c860736-5b8e-43cc-80f2-777917408dc3" /> | Modal correctly overlays all dropdowns <img width="1019" height="586" alt="image" src="https://github.com/user-attachments/assets/590332ed-5c23-4491-8137-819bf089e87e" /> | ## Checklist - [ ] This change requires a documentation update, included: [Dify Document](https://github.com/langgenius/dify-docs) - [x] I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos\!) - [x] I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change. - [x] I've updated the documentation accordingly. - [x] I ran dev/reformat(backend) and cd web && npx lint-staged(frontend) to appease the lint gods
yindo added the pull-request label 2026-02-21 20:47:25 -05:00
yindo closed this issue 2026-02-21 20:47:25 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: langgenius/dify#30395