Skip to content

fix(aci): Apply chart zoom on automation history #103392

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.

Sign up for GitHub

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

Merged
merged 1 commit into from
Nov 18, 2025
Merged

fix(aci): Apply chart zoom on automation history #103392

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
60 changes: 28 additions & 32 deletions static/app/views/automations/components/automationStatsChart.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import styled from '@emotion/styled';

import {BarChart} from 'sentry/components/charts/barChart';
import ChartZoom from 'sentry/components/charts/chartZoom';
import {HeaderTitleLegend} from 'sentry/components/charts/styles';
import {useChartZoom} from 'sentry/components/charts/useChartZoom';
import type {DateTimeObject} from 'sentry/components/charts/utils';
import LoadingError from 'sentry/components/loadingError';
import Panel from 'sentry/components/panels/panel';
Expand All @@ -28,6 +28,7 @@ export function AutomationStatsChart({
utc,
}: IssueAlertDetailsProps) {
const organization = useOrganization();
const chartZoomProps = useChartZoom({saveOnZoom: true});
Copy link
Contributor

@cursor cursor bot Nov 14, 2025

Choose a reason for hiding this comment

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

Bug: Chart Zoom Overwrites Global Filters

The useChartZoom hook is configured with saveOnZoom: true instead of usePageDate: true. This causes chart zoom to update the global page filters via updateDateTime rather than setting page-specific query parameters like the previous ChartZoom component did. The old code used usePageDate to persist zoom state to query params without affecting page filters, but the new implementation will modify global filters instead.

Fix in Cursor Fix in Web

Copy link
Member Author

@scttcper scttcper Nov 14, 2025

Choose a reason for hiding this comment

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

i think this is what i want

const {
Comment on lines +31 to 32
Copy link

@sentry sentry bot Nov 14, 2025

Choose a reason for hiding this comment

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

Bug: The useChartZoom hook fails to pass utc, start, and end props to BarChart, affecting date formatting.
Severity: HIGH | Confidence: 0.95

🔍 Detailed Analysis

The useChartZoom hook, replacing the ChartZoom component, omits utc, start, and end from its renderProps. These properties, previously passed from AutomationStatsChart to BarChart, are crucial for BarChart/BaseChart to correctly format date/time information in tooltips and axis labels when isGroupedByDate is true. The ZoomRenderProps interface for useChartZoom also lacks these fields, leading to incorrect or generic date formatting in the chart.

💡 Suggested Fix

Modify the useChartZoom hook to include utc, start, and end in its renderProps and ensure these are passed down to the BarChart component. Update the ZoomRenderProps interface in useChartZoom.tsx to include these properties.

🤖 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/automations/components/automationStatsChart.tsx#L31-L32

Potential issue: The `useChartZoom` hook, replacing the `ChartZoom` component, omits
`utc`, `start`, and `end` from its `renderProps`. These properties, previously passed
from `AutomationStatsChart` to `BarChart`, are crucial for `BarChart`/`BaseChart` to
correctly format date/time information in tooltips and axis labels when
`isGroupedByDate` is true. The `ZoomRenderProps` interface for `useChartZoom` also lacks
these fields, leading to incorrect or generic date formatting in the chart.

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

Reference_id: 2695024

data: fireHistory,
isPending,
Expand Down Expand Up @@ -59,37 +60,32 @@ export function AutomationStatsChart({
{isPending && <Placeholder height="200px" />}
{isError && <LoadingError />}
{fireHistory && (
<ChartZoom period={period} start={start} end={end} utc={utc} usePageDate>
{zoomRenderProps => (
<BarChart
{...zoomRenderProps}
isGroupedByDate
showTimeInTooltip
grid={{
left: space(0.25),
right: space(2),
top: space(3),
bottom: 0,
}}
yAxis={{
minInterval: 1,
}}
series={[
{
seriesName: t('Alerts Triggered'),
data:
fireHistory?.map(automation => ({
name: automation.date,
value: automation.count,
})) ?? [],
emphasis: {
disabled: true,
},
},
]}
/>
)}
</ChartZoom>
<BarChart
{...chartZoomProps}
showTimeInTooltip
grid={{
left: space(0.25),
right: space(2),
top: space(3),
bottom: 0,
}}
yAxis={{
minInterval: 1,
}}
series={[
{
seriesName: t('Alerts Triggered'),
data: fireHistory.map(automation => ({
name: automation.date,
value: automation.count,
})),
emphasis: {
disabled: true,
},
animation: false,
},
]}
/>
)}
</StyledPanelBody>
<ChartFooter>
Expand Down
Loading