Skip to content

fix(coding-conventions): Make activity section icon component static#120047

Open
sentry[bot] wants to merge 2 commits into
masterfrom
seer/fix/static-activity-icon-noohO6
Open

fix(coding-conventions): Make activity section icon component static#120047
sentry[bot] wants to merge 2 commits into
masterfrom
seer/fix/static-activity-icon-noohO6

Conversation

@sentry

@sentry sentry Bot commented Jul 19, 2026

Copy link
Copy Markdown
Contributor

This PR addresses a static-component-definitions violation in static/app/views/issueDetails/activitySection/index.tsx.

Root Cause:
The Icon component for activity items was being dynamically created during render via componentFunction in groupActivityIcons.tsx. This meant that on every re-render, React would see a new component identity, leading to unnecessary unmounting and re-mounting of the icon, state resets, and blocking of React Compiler optimizations.

Solution:

  1. Refactored groupActivityIcons.tsx:
    • Renamed componentFunction to renderIcon in the IconWithDefaultProps interface.
    • Changed the return type of renderIcon from React.ComponentType<SVGIconProps> to React.ReactNode.
    • Updated the NOTE and CREATE_ISSUE entries to directly return JSX elements (e.g., <SentryAppAvatar />, <IconGithub />) instead of returning component types or functions that render components.
  2. Updated index.tsx:
    • Modified the logic to directly use the iconNode returned by iconMapping.renderIcon (if available) or fall back to rendering the static Icon component with its props.

This change ensures that the icon component is no longer created dynamically during render, adhering to the static-component-definitions convention and improving rendering performance and stability.

Legal Boilerplate

Look, I get it. The entity doing business as "Sentry" was incorporated in the State of Delaware in 2015 as Functional Software, Inc. and is gonna need some rights from me in order to utilize my contributions in this here PR. So here's the deal: I retain all rights, title and interest in and to my contributions, and by keeping this boilerplate intact I confirm that Sentry can use, modify, copy, and redistribute my contributions, under Sentry's choice of terms.

Fixes CODING-CONVENTIONS-350

Comment @sentry <feedback> on this PR to have Autofix iterate on the changes.

@sentry
sentry Bot requested a review from a team as a code owner July 19, 2026 20:04
@github-actions github-actions Bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Jul 19, 2026

@cursor cursor Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit fe6c622. Configure here.

user: GroupActivity['user'];
}) => React.ComponentType<SVGIconProps>;
propsFunction?: (data: GroupActivity['data']) => Record<string, unknown>;
}) => React.ReactNode;

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missed icon mapping consumer update

High Severity

componentFunction was renamed to renderIcon and now returns a React.ReactNode instead of a component type, but progressActivityTooltip.tsx still reads componentFunction and treats the result as a component. That shared consumer needs the same ReactNode-based update as index.tsx, or typecheck fails and a naive rename would render a node as a component.

Fix in Cursor Fix in Web

Reviewed by Cursor Bugbot for commit fe6c622. Configure here.

Comment on lines 59 to 69
[GroupActivityType.NOTE]: {
Component: IconChat,
defaultProps: {},
componentFunction: ({user, sentry_app}) => {
renderIcon: ({user, sentry_app}) => {
if (sentry_app) {
return function () {
return <SentryAppAvatar sentryApp={sentry_app} />;
};
return <SentryAppAvatar sentryApp={sentry_app} />;
}
return user ? () => <StyledUserAvatar user={user} /> : IconChat;
return user ? <StyledUserAvatar user={user} /> : <IconChat size="xs" />;
},
},
[GroupActivityType.SET_RESOLVED]: {Component: IconCheckmark, defaultProps: {}},

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bug: The progress tooltip was not updated to use the new renderIcon property, causing CREATE_ISSUE activities to display a generic icon instead of a provider-specific one.
Severity: LOW

Suggested Fix

Update progressActivityTooltip.tsx to use the new renderIcon property from the icon mapping to render the icon, similar to the implementation in index.tsx. This will ensure that provider-specific icons are correctly displayed for CREATE_ISSUE activities.

Prompt for AI Agent
Review the code at the location below. A potential bug has been identified by an AI
agent. Verify if this is a real issue. If it is, propose a fix; if not, explain why it's
not valid.

Location: static/app/views/issueDetails/activitySection/groupActivityIcons.tsx#L59-L69

Potential issue: In `progressActivityTooltip.tsx`, the `ProgressActivityItem` component
attempts to render an icon for a `CREATE_ISSUE` activity. It references the
`componentFunction` property on the icon mapping, which no longer exists after a
refactor and was replaced by `renderIcon`. Because `componentFunction` is `undefined`,
the code falls back to rendering the generic `IconAdd` component. This happens when a
`CREATE_ISSUE` activity appears in the progress tooltip, which can occur if a group has
no other progress-specific activities. The result is that a generic 'add' icon is
displayed instead of the correct provider-specific icon (e.g., GitHub, Jira).

Did we get this right? 👍 / 👎 to inform future reviews.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Scope: Frontend Automatically applied to PRs that change frontend components

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant