ref(ui): decouple scraps/link from sentry specific code #102765
There are no files selected for viewing
This file contains hidden or 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
This file contains hidden or 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
This file contains hidden or 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| import {createContext, useContext, type FunctionComponent} from 'react'; | ||
| import {Link as RouterLink} from 'react-router-dom'; | ||
| import * as Sentry from '@sentry/react'; | ||
|
|
||
| import type {LinkProps} from './link'; | ||
|
|
||
| type LinkBehavior = { | ||
| behavior: (props: LinkProps) => LinkProps; | ||
| component: FunctionComponent<LinkProps>; | ||
| }; | ||
|
|
||
| const LinkBehaviorContext = createContext<LinkBehavior | null>(null); | ||
|
|
||
| const defaultLinkBehavior = { | ||
| component: RouterLink, | ||
| behavior: props => props, | ||
| } satisfies LinkBehavior; | ||
|
|
||
| export const LinkBehaviorContextProvider = LinkBehaviorContext.Provider; | ||
|
|
||
| export const useLinkBehavior = (props: LinkProps) => { | ||
| const linkBehavior = useContext(LinkBehaviorContext); | ||
|
|
||
| if (process.env.NODE_ENV === 'production' && !linkBehavior) { | ||
| Sentry.logger.warn('LinkBehaviorContext not found'); | ||
| } | ||
| const {component, behavior} = linkBehavior ?? defaultLinkBehavior; | ||
|
|
||
| return {Component: component, behavior: () => behavior(props)}; | ||
| }; |
This file contains hidden or 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
This file contains hidden or 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
This file contains hidden or 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import {SentryLinkBehaviorProvider} from './link'; | ||
| import {SentryTrackingProvider} from './tracking'; | ||
|
|
||
| export function ScrapsProviders({children}: {children: React.ReactNode}) { | ||
| return ( | ||
| <SentryTrackingProvider> | ||
| <SentryLinkBehaviorProvider>{children}</SentryLinkBehaviorProvider> | ||
| </SentryTrackingProvider> | ||
| ); | ||
| } |
This file contains hidden or 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,34 @@ | ||
| import {useMemo} from 'react'; | ||
| import {Link as RouterLink} from 'react-router-dom'; | ||
|
|
||
| import type {LinkProps} from '@sentry/scraps/link'; | ||
| import {LinkBehaviorContextProvider} from '@sentry/scraps/link/linkBehaviorContext'; | ||
|
|
||
| import {locationDescriptorToTo} from 'sentry/utils/reactRouter6Compat/location'; | ||
| import normalizeUrl from 'sentry/utils/url/normalizeUrl'; | ||
| import {useLocation} from 'sentry/utils/useLocation'; | ||
|
|
||
| export function SentryLinkBehaviorProvider({children}: {children: React.ReactNode}) { | ||
| const location = useLocation(); | ||
|
|
||
| return ( | ||
| <LinkBehaviorContextProvider | ||
| value={useMemo( | ||
| () => ({ | ||
| component: RouterLink, | ||
| behavior: ({to, ...props}: LinkProps) => { | ||
| const normalizedTo = locationDescriptorToTo(normalizeUrl(to, location)); | ||
|
|
||
| return { | ||
| to: normalizedTo, | ||
| ...props, | ||
| }; | ||
| }, | ||
| }), | ||
| [location] | ||
| )} | ||
| > | ||
| {children} | ||
| </LinkBehaviorContextProvider> | ||
| ); | ||
| } | ||
File renamed without changes.
This file contains hidden or 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
This file contains hidden or 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
This file contains hidden or 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
This file contains hidden or 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| import {SentryLinkBehaviorProvider} from 'sentry/scrapsProviders/link'; | ||
|
|
||
| export function ScrapsTestingProviders({children}: {children: React.ReactNode}) { | ||
| return <SentryLinkBehaviorProvider>{children}</SentryLinkBehaviorProvider>; | ||
| } | ||
|
Contributor
There was a problem hiding this comment. Bug: Inconsistent Sentry Wrapping Between Test and ProductionThe test version of ScrapsTestingProviders is missing the SentryTrackingProvider wrapper, which is present in the production ScrapsProviders component. This inconsistency means tests won't include tracking context that production code has, potentially missing bugs related to tracking functionality. The production version wraps children with both SentryTrackingProvider and SentryLinkBehaviorProvider, but the test version only includes SentryLinkBehaviorProvider. |
||
Oops, something went wrong.
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.
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.
Bug:
SentryLinkBehaviorProvideruses an external context, butuseLinkBehavior()reads from a local context, bypassing custom link behavior.Severity: CRITICAL | Confidence: 1.00
🔍 Detailed Analysis
The
SentryLinkBehaviorProviderinstatic/app/scrapsProviders/link.tsxattempts to provide custom link behavior using an externalLinkBehaviorContextProviderfrom@sentry/scraps. However, theuseLinkBehavior()hook instatic/app/components/core/link/link.tsxreads from a different, localLinkBehaviorContext. This mismatch prevents the custombehaviorfunction, which includes URL normalization vianormalizeUrl()andlocationDescriptorToTo(), from ever being applied. Consequently, links will not have their URLs normalized as intended.💡 Suggested Fix
Either modify
useLinkBehavior()to read from the external@sentry/scrapscontext, or updateSentryLinkBehaviorProviderto set values on the local context.🤖 Prompt for AI Agent
Did we get this right? 👍 / 👎 to inform future reviews.
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.
@sentry/scrapsis an alias forstatic/app/components/core/