[WEB-3422] fix: app sidebar fixes and improvements#6633
[WEB-3422] fix: app sidebar fixes and improvements#6633sriramveeraghanta merged 2 commits intopreviewfrom
Conversation
WalkthroughThis pull request introduces a new enumeration value in the backend workspace preferences and reorganizes several workspace sidebar elements on the frontend. The changes move the "your-work" navigation item from static to dynamic, replace "notifications" with "inbox", and update icon mappings. Additional UI modifications include adding a copy URL function for projects, adjusting padding, and refining conditional rendering of sidebar elements. These changes affect both backend models and multiple frontend components, altering control flows and visual components. Changes
Sequence Diagram(s)sequenceDiagram
participant U as User
participant S as ExtendedProjectSidebar
participant C as copyUrlToClipboard
participant T as ToastNotifier
U->>S: Click "Copy URL" button
S->>C: Call copyUrlToClipboard(projectId)
C-->>S: Return success
S->>T: Display success toast notification
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🔇 Additional comments (2)
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
web/app/[workspaceSlug]/(projects)/sidebar.tsx (1)
93-95: LGTM! Consider extracting the repeated HR styles.The conditional rendering of the horizontal rule in collapsed state improves visual clarity. However, the same HR styles are used in multiple places.
Consider extracting the repeated HR styles to a reusable constant or component:
+const SIDEBAR_HR_CLASSES = "flex-shrink-0 border-custom-sidebar-border-300 h-[0.5px] w-3/5 mx-auto my-1"; {sidebarCollapsed && ( - <hr className="flex-shrink-0 border-custom-sidebar-border-300 h-[0.5px] w-3/5 mx-auto my-1" /> + <hr className={SIDEBAR_HR_CLASSES} /> )}web/ce/components/workspace/sidebar/sidebar-item.tsx (1)
45-45: Consider enhancing type safety for static items.The static items array would benefit from type safety and could be moved to constants.
Consider this improvement:
-const staticItems = ["home", "inbox", "pi-chat", "projects"]; +const STATIC_SIDEBAR_ITEMS = ["home", "inbox", "pi-chat", "projects"] as const; +type TStaticSidebarItem = typeof STATIC_SIDEBAR_ITEMS[number]; + +// Move this to constants file and use: +const staticItems: readonly TStaticSidebarItem[] = STATIC_SIDEBAR_ITEMS;
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (11)
apiserver/plane/db/models/workspace.py(1 hunks)packages/constants/src/workspace.ts(4 hunks)web/app/[workspaceSlug]/(projects)/extended-project-sidebar.tsx(3 hunks)web/app/[workspaceSlug]/(projects)/extended-sidebar.tsx(1 hunks)web/app/[workspaceSlug]/(projects)/sidebar.tsx(1 hunks)web/ce/components/workspace/sidebar/extended-sidebar-item.tsx(2 hunks)web/ce/components/workspace/sidebar/helper.tsx(1 hunks)web/ce/components/workspace/sidebar/sidebar-item.tsx(1 hunks)web/core/components/workspace/sidebar/favorites/favorites-menu.tsx(1 hunks)web/core/components/workspace/sidebar/projects-list-item.tsx(1 hunks)web/core/components/workspace/sidebar/sidebar-menu-items.tsx(1 hunks)
✅ Files skipped from review due to trivial changes (2)
- web/app/[workspaceSlug]/(projects)/extended-sidebar.tsx
- web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
🔇 Additional comments (6)
web/ce/components/workspace/sidebar/helper.tsx (1)
9-10: LGTM! Clean implementation of the inbox icon mapping.The replacement of notifications with inbox is implemented correctly and maintains consistency with the sidebar reorganization.
web/ce/components/workspace/sidebar/extended-sidebar-item.tsx (2)
172-172: Improved drag handle discoverability.The drag handle is now always visible instead of being hidden by default, making the drag functionality more discoverable for users.
202-203: Enhanced icon styling consistency.The Eye and EyeClosed icons now have consistent size classes and improved hover states, enhancing visual feedback and accessibility.
Also applies to: 209-210
packages/constants/src/workspace.ts (1)
262-267: Improved sidebar navigation organization.The navigation structure has been enhanced by:
- Moving "your-work" to dynamic navigation items, making it more flexible
- Renaming "notifications" to "inbox", which is a more intuitive term
Also applies to: 296-296, 308-313
apiserver/plane/db/models/workspace.py (1)
399-399: Added user preference support for "Your Work".The addition of the YOUR_WORK enum value enables user preference persistence for the "Your Work" navigation item, aligning with the frontend changes.
web/core/components/workspace/sidebar/projects-list-item.tsx (1)
241-241: Enhanced drag handle visibility in extended sidebar.The drag handle is now visible when the sidebar is in extended mode, improving consistency and usability of drag-and-drop functionality.
* chore: app sidebar improvements * chore: overview icon updated
Description
This PR includes app sidebar fixes and improvements.
Type of Change
References
[WEB-3422]
Summary by CodeRabbit
New Features
Style