[WEB-3175]fix: favorites menu #6773
Conversation
vamsikrishnamathala
requested review from
anmolsinghbhatia and
prateekshourya29
|
Pull Request Linked with Plane Issues References
Comment Automatically Generated by Plane |
2 similar comments
|
Pull Request Linked with Plane Issues References
Comment Automatically Generated by Plane |
|
Pull Request Linked with Plane Issues References
Comment Automatically Generated by Plane |
WalkthroughThis pull request adds a new constant Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Component
participant LocalStorage
User->>Component: Trigger add-to-favorites
Component->>LocalStorage: Check state of IS_FAVORITE_MENU_OPEN
alt Menu is closed
LocalStorage-->>Component: Return state (false)
Component->>LocalStorage: toggleFavoriteMenu(true)
LocalStorage-->>Component: Updated state (true)
else Menu is open
LocalStorage-->>Component: Return state (true)
end
Component-->>User: Display favorite menu state
Possibly related PRs
Suggested reviewers
Poem
Tip ⚡🧪 Multi-step agentic review comment chat (experimental)
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms (2)
🪧 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: 1
🧹 Nitpick comments (2)
web/core/hooks/use-page-operations.ts (2)
153-160: Consider adding toggleFavoriteMenu to the useMemo dependency array.The implementation correctly opens the favorites menu when an item is added, which addresses the core issue. However, since the
toggleFavoriteMenufunction is used within the memoizedpageOperationsobject, it should be included in the dependency array.}, [ access, addToFavorites, archived_at, duplicate, executeCollaborativeAction, getRedirectionLink, is_favorite, is_locked, removePageFromFavorites, + toggleFavoriteMenu, + isfavoriteMenuOpen, ]);
54-56: Consider consistent naming convention for boolean variables.The variable name
isfavoriteMenuOpenuses camelCase but deviates from JavaScript conventions for boolean variables, which typically use "is" as a prefix but capitalize the following word.- const { setValue: toggleFavoriteMenu, storedValue: isfavoriteMenuOpen } = useLocalStorage<boolean>( + const { setValue: toggleFavoriteMenu, storedValue: isFavoriteMenuOpen } = useLocalStorage<boolean>(This would require updating all instances of the variable in the code.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
packages/constants/src/workspace.ts(1 hunks)web/core/components/cycles/list/cycle-list-item-action.tsx(3 hunks)web/core/components/modules/module-card-item.tsx(3 hunks)web/core/components/modules/module-list-item-action.tsx(3 hunks)web/core/components/pages/editor/header/extra-options.tsx(3 hunks)web/core/components/project/card.tsx(3 hunks)web/core/components/views/view-list-item-action.tsx(3 hunks)web/core/components/workspace/sidebar/favorites/favorites-menu.tsx(2 hunks)web/core/hooks/use-page-operations.ts(4 hunks)
🧰 Additional context used
🧬 Code Definitions (6)
web/core/components/workspace/sidebar/favorites/favorites-menu.tsx (1)
packages/constants/src/workspace.ts (1) (1)
IS_FAVORITE_MENU_OPEN(328-328)
web/core/components/modules/module-card-item.tsx (1)
packages/constants/src/workspace.ts (1) (1)
IS_FAVORITE_MENU_OPEN(328-328)
web/core/components/pages/editor/header/extra-options.tsx (2)
packages/constants/src/workspace.ts (1) (1)
IS_FAVORITE_MENU_OPEN(328-328)web/core/services/page/project-page.service.ts (1) (1)
addToFavorites(79-85)
web/core/hooks/use-page-operations.ts (2)
packages/constants/src/workspace.ts (1) (1)
IS_FAVORITE_MENU_OPEN(328-328)web/core/services/page/project-page.service.ts (1) (1)
addToFavorites(79-85)
web/core/components/cycles/list/cycle-list-item-action.tsx (1)
packages/constants/src/workspace.ts (1) (1)
IS_FAVORITE_MENU_OPEN(328-328)
web/core/components/views/view-list-item-action.tsx (1)
packages/constants/src/workspace.ts (1) (1)
IS_FAVORITE_MENU_OPEN(328-328)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: Analyze (javascript)
- GitHub Check: Analyze (python)
🔇 Additional comments (26)
packages/constants/src/workspace.ts (1)
328-328: Good addition of a centralized constant.The addition of
IS_FAVORITE_MENU_OPENas a centralized constant is a good practice that will help maintain consistency across all components that manage the favorite menu state through local storage.web/core/components/workspace/sidebar/favorites/favorites-menu.tsx (2)
16-16: Good practice using imported constant instead of string literal.Using the imported constant rather than a hardcoded string improves maintainability.
58-58: Refactored local storage key to use constant.Replacing the hardcoded string with the imported constant ensures consistency across components.
web/core/components/project/card.tsx (3)
9-10: Good import additions for implementing favorite menu toggling.Adding imports for the constant and hook that will be used to manage favorite menu state.
72-76: Good implementation of local storage for favorite menu state.The implementation correctly initializes the local storage hook with the standard constant and default state.
87-90: Improved UX by automatically opening favorites menu.This change enhances the user experience by automatically opening the favorites menu when a project is added to favorites, making it immediately visible to the user.
web/core/components/views/view-list-item-action.tsx (3)
6-7: Good import additions for implementing favorite menu toggling.Adding imports for the constant and hook that will be used to manage favorite menu state.
40-44: Good implementation of local storage for favorite menu state.The implementation correctly initializes the local storage hook with the standard constant and default state.
59-64: Improved handling of favorite addition with async/await and automatic menu toggle.Making the function async and awaiting the API call is good practice. Additionally, automatically opening the favorites menu when a view is added to favorites improves user experience.
web/core/components/pages/editor/header/extra-options.tsx (4)
4-5: Appropriate addition of the IS_FAVORITE_MENU_OPEN constant import.The import of the IS_FAVORITE_MENU_OPEN constant from @plane/constants is properly added to support the new functionality.
8-9: Good use of the useLocalStorage hook.The useLocalStorage hook import is correctly added to enable persistent state management for the favorite menu.
44-48: Well-implemented local storage state management.The local storage integration for tracking the favorite menu's open/closed state using the useLocalStorage hook is appropriately implemented with a default state of false.
60-67: Successfully enhanced favorite functionality with menu auto-opening.The implementation correctly opens the favorite menu when a page is added to favorites, providing immediate visual feedback to users. This enhances the user experience by making newly favorited items immediately visible.
web/core/components/modules/module-list-item-action.tsx (2)
16-16: Good addition of the useLocalStorage hook import.The useLocalStorage hook is correctly imported to support the favorites menu state management.
69-70: Appropriate implementation of automatic favorites menu opening.The implementation correctly opens the favorites menu when adding a module to favorites, improving user experience by providing immediate visual feedback.
web/core/components/cycles/list/cycle-list-item-action.tsx (4)
9-15: Correctly imported the IS_FAVORITE_MENU_OPEN constant.The IS_FAVORITE_MENU_OPEN constant is properly imported from @plane/constants package to maintain consistency across the application.
16-16: Good addition of the useLocalStorage hook import.The useLocalStorage hook is correctly imported to support persistent state management for the favorites menu functionality.
67-71: Well-implemented local storage state management.The local storage integration using the useLocalStorage hook with the correct constant and default value is properly implemented.
105-105: Successfully implemented favorites menu auto-opening functionality.The implementation correctly opens the favorites menu when a cycle is added to favorites, providing immediate visual feedback to users and enhancing their experience.
web/core/components/modules/module-card-item.tsx (4)
16-17: Correct import of the IS_FAVORITE_MENU_OPEN constant.The IS_FAVORITE_MENU_OPEN constant is properly imported from @plane/constants to ensure consistency across the application.
18-18: Good addition of the useLocalStorage hook import.The useLocalStorage hook is correctly imported to support the favorites menu functionality.
63-65: Well-implemented local storage state management.The local storage integration for tracking the favorite menu's open/closed state is appropriately implemented with the correct constant and default value of false.
83-83: Appropriate implementation of automatic favorites menu opening.The implementation correctly opens the favorites menu when adding a module to favorites, improving user experience by providing immediate visual feedback.
web/core/hooks/use-page-operations.ts (3)
2-3: Import properly added for favorites menu constant.The import for
IS_FAVORITE_MENU_OPENfrom@plane/constantshas been correctly added to enable consistent favorite menu state tracking across components.
16-17: Local storage hook import properly added.The
useLocalStoragehook import is appropriate for persisting the favorites menu state.
53-57: Good implementation of local storage state for favorites menu.The implementation correctly:
- Uses a descriptive constant as the storage key
- Includes a sensible default value (false)
- Destructures both the value and setter function with clear naming
This approach ensures the favorites menu state persists between sessions.
* fix: favrotites menu open * fix: open fav menu on starring projec * chore: added constant for hardcoded text
Description
This update fixes open/close for favorties menu in the sidebar when an entity is marked as favorite.
Type of Change
Screenshots and Media (if applicable)
Test Scenarios
References
WEB-3175
Summary by CodeRabbit