-
Notifications
You must be signed in to change notification settings - Fork 1.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[WEB-2770] fix: inbox issue detail loader on focus change #6074
Conversation
WalkthroughThe changes introduce a new function 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 (
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (1)
web/app/[workspaceSlug]/(projects)/notifications/page.tsx (1)
65-68
: Well-structured callback implementationGood refactoring of the notification removal logic into a memoized callback. This prevents unnecessary re-renders when the function is passed as a prop to child components.
Consider adding a brief JSDoc comment to document the function's purpose:
+ /** + * Clears the currently selected notification + */ const embedRemoveCurrentNotification = useCallback( () => setCurrentSelectedNotificationId(undefined), [setCurrentSelectedNotificationId] );
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (1)
web/app/[workspaceSlug]/(projects)/notifications/page.tsx
(3 hunks)
🔇 Additional comments (2)
web/app/[workspaceSlug]/(projects)/notifications/page.tsx (2)
3-3
: LGTM: Clean import addition
The useCallback import is correctly added to the existing React imports.
103-103
: Verify prop handling in child components
The callback is consistently passed to both InboxContentRoot and IssuePeekOverview components. Let's verify the implementation in these components.
Also applies to: 108-108
✅ Verification successful
Let me try a different approach to locate these components first.
Let me try one more search with corrected file type flags:
Let's try one final search without file type flags since they're not supported:
Prop is properly defined and handled in both components
The verification shows that embedRemoveCurrentNotification
is:
- Correctly defined as an optional callback prop (
() => void
) in bothInboxContentRoot
andIssuePeekOverview
components - Consistently typed across the component hierarchy
- Properly passed through related components like
InboxIssueHeader
andIssuePeekOverviewView
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify that the child components properly handle the embedRemoveCurrentNotification prop
# Check InboxContentRoot component implementation
echo "Checking InboxContentRoot implementation..."
ast-grep --pattern 'interface $interface {
$$$
embedRemoveCurrentNotification: $type
$$$
}' web/components/inbox
# Check IssuePeekOverview component implementation
echo "Checking IssuePeekOverview implementation..."
ast-grep --pattern 'interface $interface {
$$$
embedRemoveCurrentNotification: $type
$$$
}' web/components/issues
Length of output: 575
Script:
#!/bin/bash
# Find the component files
echo "Locating component files..."
fd -e tsx -e ts InboxContentRoot
fd -e tsx -e ts IssuePeekOverview
# Once found, let's examine their content
echo -e "\nChecking embedRemoveCurrentNotification usage..."
rg -l "embedRemoveCurrentNotification" -t typescript -t typescriptreact
Length of output: 355
Script:
#!/bin/bash
# Search for the components and prop usage
echo "Searching for components and prop usage..."
rg --type-list # Check available file types first
echo -e "\nSearching for components and prop..."
rg -t tsx -t ts "InboxContentRoot|IssuePeekOverview" -A 5
rg -t tsx -t ts "embedRemoveCurrentNotification" -A 2
Length of output: 5175
Script:
#!/bin/bash
# Search for components and prop usage in all files
echo "Searching for components..."
rg "export.*InboxContentRoot|export.*IssuePeekOverview" -A 10
echo -e "\nSearching for prop usage..."
rg "embedRemoveCurrentNotification.*:" -A 2
Length of output: 7416
Media
Screen.Recording.2024-11-19.at.4.58.55.PM.mov
Screen.Recording.2024-11-19.at.4.58.21.PM.mov
Issue link: WEB-2770
Summary by CodeRabbit