Skip to content

feat(usage overview): Extract drawer charts into component#104138

Merged
isabellaenriquez merged 10 commits intomasterfrom
isabella/uo-v2-pt-3
Dec 2, 2025
Merged

feat(usage overview): Extract drawer charts into component#104138
isabellaenriquez merged 10 commits intomasterfrom
isabella/uo-v2-pt-3

Conversation

@isabellaenriquez
Copy link
Copy Markdown
Contributor

@isabellaenriquez isabellaenriquez commented Nov 28, 2025

Split out from #103983

Pt 3 of https://linear.app/getsentry/issue/BIL-1817/update-usage-overview-table-with-new-designs

Extracts the chart and tables used in the existing category drawer into a component + updates designs

@github-actions github-actions bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Nov 28, 2025
@jasonyuezhang jasonyuezhang mentioned this pull request Nov 28, 2025
Open
@codecov
Copy link
Copy Markdown

codecov bot commented Nov 28, 2025

❌ 2 Tests Failed:

Tests completed Failed Passed Skipped
12746 2 12744 10
View the top 2 failed test(s) by shortest run time 
CategoryUsageDrawer renders event breakdown
Stack Traces | 0.03s run time 
TypeError: Cannot read properties of undefined (reading 'stats')
    at stats (.../subscriptionPage/usageOverview/charts.tsx:54:27)
    at Object.react_stack_bottom_frame (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:25904:20)
    at renderWithHooks (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:7662:22)
    at updateFunctionComponent (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:10166:19)
    at beginWork (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:11778:18)
    at runWithFiberInDEV (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:874:13)
    at performUnitOfWork (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:17641:22)
    at workLoopSync (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:17469:41)
    at renderRootSync (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:17450:11)
    at performWorkOnRoot (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:16583:35)
    at performWorkOnRootViaSchedulerTask (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:18957:7)
    at flushActQueue (.../sentry/node_modules/.pnpm/react@19.2..../react/cjs/react.development.js:590:34)
    at recursivelyFlushAsyncActWork (.../sentry/node_modules/.pnpm/react@19.2..../react/cjs/react.development.js:566:13)
    at Immediate.<anonymous> (.../sentry/node_modules/.pnpm/react@19.2..../react/cjs/react.development.js:849:32)
    at processImmediate (node:internal/timers:485:21)
    at process.callbackTrampoline (node:internal/async_hooks:130:17)
CategoryUsageDrawer renders
Stack Traces | 0.094s run time 
TypeError: Cannot read properties of undefined (reading 'stats')
    at stats (.../subscriptionPage/usageOverview/charts.tsx:54:27)
    at Object.react_stack_bottom_frame (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:25904:20)
    at renderWithHooks (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:7662:22)
    at updateFunctionComponent (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:10166:19)
    at beginWork (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:11778:18)
    at runWithFiberInDEV (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:874:13)
    at performUnitOfWork (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:17641:22)
    at workLoopSync (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:17469:41)
    at renderRootSync (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:17450:11)
    at performWorkOnRoot (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:16583:35)
    at performWorkOnRootViaSchedulerTask (.../sentry/node_modules/.pnpm/react-dom@19.2.0_react@19.2..../react-dom/cjs/react-dom-client.development.js:18957:7)
    at flushActQueue (.../sentry/node_modules/.pnpm/react@19.2..../react/cjs/react.development.js:590:34)
    at .../sentry/node_modules/.pnpm/react@19.2..../react/cjs/react.development.js:847:21

To view more test analytics, go to the Test Analytics Dashboard
📋 Got 3 mins? Take this short survey to help us improve Test Analytics.

@isabellaenriquez isabellaenriquez marked this pull request as ready for review November 28, 2025 20:20
@isabellaenriquez isabellaenriquez requested a review from a team as a code owner November 28, 2025 20:20
cursor[bot]
cursor bot reviewed Nov 28, 2025
View reviewed changes
static/gsApp/views/subscriptionPage/usageTotalsTable.tsx
border={isNewBillingUI ? 'primary' : undefined}
radius={isNewBillingUI ? 'md' : undefined}
>
<Grid gap="md" padding={isNewBillingUI ? 'md' : 'md 0'}>
Copy link
Copy Markdown
Contributor

@cursor cursor bot Nov 28, 2025

Choose a reason for hiding this comment

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

Bug: Missing border and radius styling for new billing UI

The border and radius props were removed from the Grid component, eliminating the border and border-radius styling that was conditionally applied when isNewBillingUI is true. This causes a visual regression in the new billing UI where the usage totals table should display with a primary border and medium border radius, but now renders without these visual elements.

Fix in Cursor Fix in Web

Copy link
Copy Markdown
Contributor

@vbro vbro Dec 1, 2025

Choose a reason for hiding this comment

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

This is intentional.
CC: @isabellaenriquez

Base automatically changed from isabella/uo-v2-pt-2 to master December 2, 2025 18:10
@isabellaenriquez isabellaenriquez merged commit b74d865 into master Dec 2, 2025
48 checks passed
@isabellaenriquez isabellaenriquez deleted the isabella/uo-v2-pt-3 branch December 2, 2025 18:42
@github-actions github-actions bot locked and limited conversation to collaborators Dec 18, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

@cursor cursor[bot] cursor[bot] left review comments

@brendanhsentry brendanhsentry brendanhsentry approved these changes

+1 more reviewer

@vbro vbro vbro approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

Scope: Frontend Automatically applied to PRs that change frontend components

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@isabellaenriquez @vbro @brendanhsentry