[WEB-2926]fix: added tooltips for favorites #6320
Conversation
WalkthroughThis pull request introduces minor modifications across three files in the web core components, focusing on enhancing user interface interactions, particularly in workspace sidebar and issue modal components. The changes primarily involve adding Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
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 (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-title.tsx (1)
31-36: Consider adding an explicitaria-labelfor improved accessibility
When the sidebar is collapsed, the tooltip effectively provides context; however, screen readers may benefit from an explicitaria-label. This helps ensure that users relying on assistive technologies receive clear contextual information.<Tooltip tooltipContent={title} isMobile={isMobile} disabled={!isSidebarCollapsed} position="right"> - <Link href={href} className={isSidebarCollapsed ? collapsedClass : linkClass} draggable onClick={handleOnClick}> + <Link + href={href} + aria-label={isSidebarCollapsed ? title : undefined} + className={isSidebarCollapsed ? collapsedClass : linkClass} + draggable + onClick={handleOnClick} + > ...web/core/components/workspace/sidebar/favorites/favorite-folder.tsx (1)
178-187: Validate tooltip usage and consider fallback text for accessibility
The tooltip provides context for the folder name when the sidebar is collapsed. Consider including a fallback (e.g., anaria-label) on the button itself to improve screen-reader accessibility.<Tooltip tooltipContent={favorite.name} position="right" isMobile={isMobile}> <Disclosure.Button + aria-label={favorite.name} as="button" className="size-8 aspect-square flex-shrink-0 grid place-items-center" > ... </Tooltip>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
web/core/components/issues/issue-modal/base.tsx(1 hunks)web/core/components/workspace/sidebar/favorites/favorite-folder.tsx(1 hunks)web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-title.tsx(2 hunks)
✅ Files skipped from review due to trivial changes (1)
- web/core/components/issues/issue-modal/base.tsx
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: lint-web
- GitHub Check: Analyze (javascript)
- GitHub Check: Analyze (python)
🔇 Additional comments (1)
web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-title.tsx (1)
5-5: Successful integration of Tooltip component from @plane/ui
The import statement looks correct and aligns well with the codebase's usage of@plane/uicomponents.
Description
Added tooltips to favorites while the sidebar is collapsed to improve readability.
Type of Change
References
WEB-2926
Summary by CodeRabbit
UI Improvements
Refactor