feat(preprod): Add size monitor UI by chromy · Pull Request #108211 · getsentry/sentry

chromy · 2026-02-13T11:37:58Z

Add list, detail, and create/edit views for the preprod_size_analysis
detector type ("Mobile Builds"). Users can configure a metric
(install/download size), measurement (absolute/diff/relative), optional
build filters, and priority thresholds. Includes a live preview section,
detector type selection form, and routes at /detectors/mobile-builds/.

PRs:

feat(preprod): Add Size Analysis detector #108208 Add size_analysis detector
feat(preprod): Hook size analysis detector to diff #108209 Hook size analysis detector to diff
feat(preprod): Add new issue type to frontend #108210 Add new issue type to frontend
feat(preprod): Add size monitor UI #108211 Add size monitor UI (this PR)

Design doc

github-actions · 2026-02-13T11:38:14Z

🚨 Warning: This pull request contains Frontend and Backend changes!

It's discouraged to make changes to Sentry's Frontend and Backend in a single pull request. The Frontend and Backend are not atomically deployed. If the changes are interdependent of each other, they must be separated into two pull requests and be made forward or backwards compatible, such that the Backend or Frontend can be safely deployed independently.

Have questions? Please ask in the #discuss-dev-infra channel.

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx

src/sentry/preprod/size_analysis/grouptype.py

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx

static/app/views/detectors/components/detectorTypeForm.tsx

src/sentry/preprod/size_analysis/grouptype.py

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx

github-actions · 2026-02-13T11:47:40Z

This PR has a migration; here is the generated SQL for src/sentry/preprod/migrations/0027_size_analysis_subscription.py

for 0027_size_analysis_subscription in preprod

--
-- Create model SizeAnalysisSubscription
--
CREATE TABLE "sentry_sizeanalysissubscription" ("id" bigint NOT NULL PRIMARY KEY GENERATED BY DEFAULT AS IDENTITY, "date_updated" timestamp with time zone NOT NULL, "date_added" timestamp with time zone NOT NULL, "project_id" bigint NOT NULL);
ALTER TABLE "sentry_sizeanalysissubscription" ADD CONSTRAINT "sentry_sizeanalysiss_project_id_41e3355e_fk_sentry_pr" FOREIGN KEY ("project_id") REFERENCES "sentry_project" ("id") DEFERRABLE INITIALLY DEFERRED NOT VALID;
ALTER TABLE "sentry_sizeanalysissubscription" VALIDATE CONSTRAINT "sentry_sizeanalysiss_project_id_41e3355e_fk_sentry_pr";
CREATE INDEX CONCURRENTLY "sentry_sizeanalysissubscription_project_id_41e3355e" ON "sentry_sizeanalysissubscription" ("project_id");

Add PreprodSizeAnalysisGroupType (type_id=11003) with detector handler and validators that integrate with the workflow engine to emit issues when build size thresholds are exceeded. - PreprodSizeAnalysisDetectorHandler: evaluates DataPackets from size comparisons and produces IssueOccurrences - PreprodSizeAnalysisDetectorValidato validate detector creation via the API - Register the GroupType import in preprod/grouptype.py PRs: - #108208 Add size_analysis detector (this PR) - #108209 Hook size analysis detector to diff - #108210 Add new issue type to frontend - #108211 Add size monitor UI [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6) This stack of PRs is missing a handful of important features: - Filters - Detailed data on the occurrence - Some UI polish but it works end to end.

Add PREPROD_SIZE_ANALYSIS to the IssueType enum, IssueTitle mapping, and occurrence type lookup (type_id 11003) so the frontend can recognize and label Size Analysis issues. PRs: - #108208 Add size_analysis detector - #108209 Hook size analysis detector to diff - #108210 Add new issue type to frontend (this PR) - #108211 Add size monitor UI The old issue types will later be deprecated: ``` 11001: IssueType.PREPROD_STATIC, 11002: IssueType.PREPROD_DELTA, ``` [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6)

Replace direct Kafka occurrence production with the workflow engine's DataPacket pipeline. maybe_emit_issues() now looks up SizeAnalysisSubscriptions for the project and feeds size deltas into process_data_packet(), which resolves linked detectors and evaluates them instead of using a hardcoded threshold. PRs: - #108208 Add size_analysis detector - #108209 Hook size analysis detector to diff (this PR) - #108210 Add new issue type to frontend - #108211 Add size monitor UI [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6)

malwilley

Looking good! Just a few comments.

There is some similar code/styling that we could probably consolidate into reusable components, but nothing too egregious and it's probably better to wait for more use cases before doing that.

malwilley · 2026-02-23T21:32:16Z

static/app/views/detectors/components/details/mobileBuild/detect.tsx

+  }
+
+  return t('Above %(value)s%(unit)s', {
+    value: comparisonValue,


Do you need to convert to MB here?

Thank you! Fixed.

malwilley · 2026-02-23T21:33:29Z

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx

+      )
+    )
+  );
+  const mediumThreshold = String(


I thought there was no medium threshold?

Yep! We were once the fence a bit but we've decided to start with just low & high. Removed.

malwilley · 2026-02-23T21:34:29Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+  const isPercentage = thresholdType === 'relative_diff';
+  const threshold = highThreshold;
+  const thresholdUnit = isPercentage ? '%' : 'MB';
+  const thresholdDisplay = threshold ? `${threshold} ${thresholdUnit}` : '...';


nit: usually we use the unicode character …

malwilley · 2026-02-23T21:37:41Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+  );
+}
+
+const PreviewTable = styled('div')`


Can you achieve this with the Grid component? There are quite a few styles in this component that you could replace with the layout scraps: https://sentry.sentry.io/stories/core/grid/

changed to use Grid!

malwilley · 2026-02-23T21:38:54Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+  display: contents;
+
+  > * {
+    background: ${p => p.theme.tokens.background.secondary};


Could these styles be applied to HeaderCell? (or even better use the layout and typography scraps)

Updated this to be a lot nicer (and use Flex/Text etc) however still a little ugly in places.

malwilley · 2026-02-23T21:40:47Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+
+  return (
+    <Container>
+      <Section


Thank you for making this! We were planning on adding this to the other monitor types as well, so it would be nice if we had the visual component added to detectors/components/forms/common/ (called something like DetectorIssuePreview?)

Moved most the content to static/app/views/detectors/components/forms/common/detectorIssuePreview.tsx
with a new component DetectorIssuePreview

Add PreprodSizeAnalysisGroupType (type_id=11003) with detector handler and validators that integrate with the workflow engine to emit issues when build size thresholds are exceeded. - PreprodSizeAnalysisDetectorHandler: evaluates DataPackets from size comparisons and produces IssueOccurrences - PreprodSizeAnalysisDetectorValidato validate detector creation via the API - Register the GroupType import in preprod/grouptype.py PRs: - #108208 Add size_analysis detector (this PR) - #108209 Hook size analysis detector to diff - #108210 Add new issue type to frontend - #108211 Add size monitor UI [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6) This stack of PRs is missing a handful of important features: - Filters - Detailed data on the occurrence - Some UI polish but it works end to end.

Add PREPROD_SIZE_ANALYSIS to the IssueType enum, IssueTitle mapping, and occurrence type lookup (type_id 11003) so the frontend can recognize and label Size Analysis issues. PRs: - #108208 Add size_analysis detector - #108209 Hook size analysis detector to diff - #108210 Add new issue type to frontend (this PR) - #108211 Add size monitor UI The old issue types will later be deprecated: ``` 11001: IssueType.PREPROD_STATIC, 11002: IssueType.PREPROD_DELTA, ``` [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6)

Add PreprodSizeAnalysisGroupType (type_id=11003) with detector handler and validators that integrate with the workflow engine to emit issues when build size thresholds are exceeded. - PreprodSizeAnalysisDetectorHandler: evaluates DataPackets from size comparisons and produces IssueOccurrences - PreprodSizeAnalysisDetectorValidato validate detector creation via the API - Register the GroupType import in preprod/grouptype.py PRs: - #108208 Add size_analysis detector (this PR) - #108209 Hook size analysis detector to diff - #108210 Add new issue type to frontend - #108211 Add size monitor UI [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6) This stack of PRs is missing a handful of important features: - Filters - Detailed data on the occurrence - Some UI polish but it works end to end.

Add PREPROD_SIZE_ANALYSIS to the IssueType enum, IssueTitle mapping, and occurrence type lookup (type_id 11003) so the frontend can recognize and label Size Analysis issues. PRs: - #108208 Add size_analysis detector - #108209 Hook size analysis detector to diff - #108210 Add new issue type to frontend (this PR) - #108211 Add size monitor UI The old issue types will later be deprecated: ``` 11001: IssueType.PREPROD_STATIC, 11002: IssueType.PREPROD_DELTA, ``` [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6)

Replace direct Kafka occurrence production with the workflow engine's DataPacket pipeline. maybe_emit_issues() now looks up SizeAnalysisSubscriptions for the project and feeds size deltas into process_data_packet(), which resolves linked detectors and evaluates them instead of using a hardcoded threshold. PRs: - #108208 Add size_analysis detector - #108209 Hook size analysis detector to diff (this PR) - #108210 Add new issue type to frontend - #108211 Add size monitor UI [Design doc](https://www.notion.so/sentry/Size-Monitors-3068b10e4b5d805ca57de084d1b4eba6)

static/app/views/detectors/components/detectorLink.tsx

static/app/views/settings/project/preprod/types.ts

static/app/views/detectors/components/details/mobileBuild/detect.tsx

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx

static/app/views/settings/project/preprod/types.ts

chromy

Thanks!

chromy · 2026-02-24T15:00:16Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+
+  return (
+    <Container>
+      <Section


Moved most the content to static/app/views/detectors/components/forms/common/detectorIssuePreview.tsx
with a new component DetectorIssuePreview

chromy · 2026-02-25T19:16:47Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+  );
+}
+
+const PreviewTable = styled('div')`


changed to use Grid!

chromy · 2026-02-25T20:52:36Z

static/app/views/detectors/components/details/mobileBuild/detect.tsx

+  }
+
+  return t('Above %(value)s%(unit)s', {
+    value: comparisonValue,


Thank you! Fixed.

chromy · 2026-02-25T21:53:29Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+  display: contents;
+
+  > * {
+    background: ${p => p.theme.tokens.background.secondary};


Updated this to be a lot nicer (and use Flex/Text etc) however still a little ugly in places.

cursor

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

^{Bugbot Autofix is OFF. To automatically fix reported issues with Cloud Agents, enable Autofix in the Cursor dashboard.}

cursor · 2026-02-25T21:58:53Z

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx

+
+  const threshold = Number(highThreshold);
+  const regression = isPercentage ? 0.05 : 1;
+  const actual = threshold === undefined ? undefined : threshold + regression;


Preview shows incorrect value when threshold is empty

Medium Severity

Number() never returns undefined — it returns NaN or a number. So the check threshold === undefined on line 35 is always false. When highThreshold is an empty string (the default form value), Number('') evaluates to 0, making actual = 0 + regression (i.e. 1 for MB or 0.05 for percentage). The preview then incorrectly shows something like "1 MB > … Threshold" on initial load instead of showing ellipsis for both values. The guard needs to check highThreshold (the original string) for emptiness rather than checking the already-converted numeric threshold against undefined.

malwilley

Nice work!

chromy requested review from a team as code owners February 13, 2026 11:37

github-actions bot added Scope: Frontend Automatically applied to PRs that change frontend components Scope: Backend Automatically applied to PRs that change backend components labels Feb 13, 2026

sentry bot reviewed Feb 13, 2026

View reviewed changes

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx Outdated Show resolved Hide resolved

src/sentry/preprod/size_analysis/grouptype.py Outdated Show resolved Hide resolved

vercel bot deployed to Preview February 13, 2026 11:42 View deployment

cursor bot reviewed Feb 13, 2026

View reviewed changes

sentry bot reviewed Feb 13, 2026

View reviewed changes

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx Outdated Show resolved Hide resolved

chromy marked this pull request as draft February 13, 2026 11:45

chromy changed the base branch from master to chromy/2026-03-12-add-issue-type-to-frontend February 13, 2026 11:46

This was referenced Feb 13, 2026

feat(preprod): Add SizeAnalysisSubscription as a DataSource #108172

Draft

feat(preprod): Add Size Analysis detector #108208

Merged

feat(preprod): Hook size analysis detector to diff #108209

Merged

feat(preprod): Add new issue type to frontend #108210

Merged

chromy force-pushed the chromy/2026-03-12-add-issue-type-to-frontend branch 2 times, most recently from faf4368 to 3f32d87 Compare February 16, 2026 18:36

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch from 759cbb5 to 3117ac8 Compare February 16, 2026 18:36

vercel bot deployed to Preview February 16, 2026 18:39 View deployment

chromy force-pushed the chromy/2026-03-12-add-issue-type-to-frontend branch 2 times, most recently from 3de16ed to 1d56ea9 Compare February 20, 2026 15:31

Base automatically changed from chromy/2026-03-12-add-issue-type-to-frontend to master February 23, 2026 08:44

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch from 3117ac8 to ed9ae01 Compare February 23, 2026 13:09

vercel bot deployed to Preview February 23, 2026 13:12 View deployment

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch 2 times, most recently from 2888387 to 9469914 Compare February 23, 2026 17:30

vercel bot deployed to Preview February 23, 2026 17:33 View deployment

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch from 9469914 to f117bb3 Compare February 23, 2026 17:39

vercel bot deployed to Preview February 23, 2026 17:42 View deployment

chromy marked this pull request as ready for review February 23, 2026 18:06

malwilley reviewed Feb 23, 2026

View reviewed changes

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch from f117bb3 to 42ecb2c Compare February 25, 2026 19:35

chromy requested a review from a team as a code owner February 25, 2026 19:35

vercel bot deployed to Preview February 25, 2026 19:40 View deployment

cursor bot reviewed Feb 25, 2026

View reviewed changes

static/app/views/detectors/components/detectorLink.tsx Show resolved Hide resolved

static/app/views/settings/project/preprod/types.ts Show resolved Hide resolved

static/app/views/detectors/components/details/mobileBuild/detect.tsx Show resolved Hide resolved

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch from cca1f63 to db5ea49 Compare February 25, 2026 20:51

vercel bot deployed to Preview February 25, 2026 20:55 View deployment

cursor bot reviewed Feb 25, 2026

View reviewed changes

static/app/views/detectors/components/forms/mobileBuild/previewSection.tsx Show resolved Hide resolved

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch from 3a93a8d to 12d8162 Compare February 25, 2026 21:20

vercel bot deployed to Preview February 25, 2026 21:23 View deployment

sentry bot reviewed Feb 25, 2026

View reviewed changes

static/app/views/detectors/components/forms/mobileBuild/mobileBuildFormData.tsx Show resolved Hide resolved

cursor bot reviewed Feb 25, 2026

View reviewed changes

static/app/views/settings/project/preprod/types.ts Show resolved Hide resolved

feat(preprod): Add size monitor UI

0949d4f

chromy force-pushed the chromy/2026-03-12-add-size-monitor-to-frontend branch from 12d8162 to 0949d4f Compare February 25, 2026 21:47

vercel bot deployed to Preview February 25, 2026 21:50 View deployment

chromy commented Feb 25, 2026

View reviewed changes

cursor bot reviewed Feb 25, 2026

View reviewed changes

malwilley approved these changes Feb 25, 2026

View reviewed changes

chromy merged commit 05988cd into master Feb 26, 2026
63 checks passed

chromy deleted the chromy/2026-03-12-add-size-monitor-to-frontend branch February 26, 2026 09:52

github-actions bot locked and limited conversation to collaborators Mar 13, 2026

Uh oh!

Conversation

chromy commented Feb 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Feb 13, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

github-actions bot commented Feb 13, 2026

Uh oh!

malwilley left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

chromy left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

cursor bot left a comment

Choose a reason for hiding this comment

Uh oh!

cursor bot Feb 25, 2026

Choose a reason for hiding this comment

Preview shows incorrect value when threshold is empty

Uh oh!

malwilley left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

chromy commented Feb 13, 2026 •

edited

Loading