New Admin UI - Drawer #4475
Open
New Admin UI - Drawer #4475
Conversation
This file contains 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
# Conflicts: # todo.txt
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.
Changes
This PR creates the Drawer component. Here is a pair of sshots.
The first is File Manager, where
modalprop is set tofalse(default value actually). This means the user can also interact with the UI in the background.This is the main menu, where
modalprop is set totrue, meaning no background interactions are possible.Another random sshot:
Extra Changes
1. Updated File Manager Drawer Code
Had to accommodate the file details drawer in File Manager a bit.
Did some cleanups along the way too (some styled components are no longer needed).
Also, while I was at it, I made these buttons larger:
2. Updated Query Builder Drawer Code
Had to accommodate the file details drawer in ACO's Query Builder a bit.
Did some cleanups along the way too (some styled components are no longer needed).
Notes
1. Tabs in Dialog
We had a discussion on tabs being rendered in an opened dialog. There were a couple of options here, but, ultimately, I've done it in a way where you pass
bodyPadding: falseprop to theDialogcomponent. That way, the body has no padding, and tabs can be used within the dialog as imagined in Figma designs (they taking the full width of the dialog).We still do need to revisit tokens on Tabs, but overall, I think it'll do.
![image](https://github.com/user-attachments/assets/1fc3a86d-8314-4294-a6bb-54e7c47b80e