fix(starfish): Obey utc URL parameter (#61963)

Cleaning up the hacks of early Starfish. Back then, we manually hard-coded `utc={false}`. We don't need to do that anymore. The Starfish `Chart` component auto-obeys the start and end! This is handy because it's also a good place to always obey the `utc` parameter. ## Changes - Obey `utc` URL parameter in `Chart` - Remove unnecessary UTC prop
getsentry · Dec 19, 2023 · 4299bfa · 4299bfa
1 parent 6765537
commit 4299bfa
Show file tree

Hide file tree

Showing 16 changed files with 2 additions and 36 deletions.
diff --git a/static/app/views/performance/browser/interactionSummary/interactionBreakdownChart.tsx b/static/app/views/performance/browser/interactionSummary/interactionBreakdownChart.tsx
@@ -25,7 +25,6 @@ export function InteractionBreakdownChart({operation, element, page}: Props) {
         height={200}
         data={data}
         loading={isLoading}
-        utc={false}
         chartColors={[CHART_PALETTE[0][0]]}
         durationUnit={getDurationUnit(data)}
         aggregateOutputFormat="duration"

diff --git a/static/app/views/performance/browser/resources/resourceSummaryPage/resourceSummaryCharts.tsx b/static/app/views/performance/browser/resources/resourceSummaryPage/resourceSummaryCharts.tsx
@@ -67,7 +67,6 @@ function ResourceSummaryCharts(props: {groupId: string}) {
             height={160}
             data={[spanMetricsSeriesData?.[`spm()`]]}
             loading={areSpanMetricsSeriesLoading}
-            utc={false}
             isLineChart
             definedAxisTicks={4}
             aggregateOutputFormat="rate"
@@ -87,7 +86,6 @@ function ResourceSummaryCharts(props: {groupId: string}) {
             height={160}
             data={[spanMetricsSeriesData?.[`avg(${SPAN_SELF_TIME})`]]}
             loading={areSpanMetricsSeriesLoading}
-            utc={false}
             chartColors={[AVG_COLOR]}
             isLineChart
             definedAxisTicks={4}
@@ -105,7 +103,6 @@ function ResourceSummaryCharts(props: {groupId: string}) {
               spanMetricsSeriesData?.[`avg(${HTTP_RESPONSE_CONTENT_LENGTH})`],
             ]}
             loading={areSpanMetricsSeriesLoading}
-            utc={false}
             chartColors={[AVG_COLOR]}
             isLineChart
             definedAxisTicks={4}

diff --git a/static/app/views/performance/browser/webVitals/components/performanceScoreBreakdownChart.tsx b/static/app/views/performance/browser/webVitals/components/performanceScoreBreakdownChart.tsx
@@ -111,7 +111,6 @@ export function PerformanceScoreBreakdownChart({transaction}: Props) {
         )}
         disableXAxis
         loading={isLoading}
-        utc={false}
         grid={{
           left: 5,
           right: 5,

diff --git a/static/app/views/performance/database/durationChart.tsx b/static/app/views/performance/database/durationChart.tsx
@@ -23,7 +23,6 @@ export function DurationChart({series, isLoading}: Props) {
         }}
         data={[series]}
         loading={isLoading}
-        utc={false}
         chartColors={[AVG_COLOR]}
         isLineChart
       />

diff --git a/static/app/views/performance/database/throughputChart.tsx b/static/app/views/performance/database/throughputChart.tsx
@@ -25,7 +25,6 @@ export function ThroughputChart({series, isLoading}: Props) {
         }}
         data={[series]}
         loading={isLoading}
-        utc={false}
         chartColors={[THROUGHPUT_COLOR]}
         isLineChart
         aggregateOutputFormat="rate"

diff --git a/static/app/views/performance/landing/widgets/widgets/performanceScoreListWidget.tsx b/static/app/views/performance/landing/widgets/widgets/performanceScoreListWidget.tsx
@@ -84,7 +84,6 @@ export function PerformanceScoreListWidget(props: PerformanceWidgetProps) {
           )}
           disableXAxis
           loading={false}
-          utc={false}
           grid={{
             left: 5,
             right: 5,

diff --git a/static/app/views/performance/landing/widgets/widgets/slowScreens.tsx b/static/app/views/performance/landing/widgets/widgets/slowScreens.tsx
@@ -293,7 +293,6 @@ function SlowScreensByTTID(props: PerformanceWidgetProps) {
           height={props.chartHeight}
           data={Object.values(transformedReleaseSeries)}
           loading={provided.widgetData.chart.isLoading}
-          utc={false}
           grid={{
             left: '0',
             right: '0',

diff --git a/static/app/views/starfish/components/chart.tsx b/static/app/views/starfish/components/chart.tsx
@@ -76,7 +76,6 @@ export const STARFISH_FIELDS: Record<string, {outputType: AggregationOutputType}
 type Props = {
   data: Series[];
   loading: boolean;
-  utc: boolean;
   aggregateOutputFormat?: AggregationOutputType;
   chartColors?: string[];
   chartGroup?: string;
@@ -159,7 +158,6 @@ function Chart({
   data,
   dataMax,
   previousData,
-  utc,
   loading,
   height,
   grid,
@@ -193,7 +191,7 @@ function Chart({
   const router = useRouter();
   const theme = useTheme();
   const pageFilters = usePageFilters();
-  const {start, end, period} = pageFilters.selection.datetime;
+  const {start, end, period, utc} = pageFilters.selection.datetime;
 
   const defaultRef = useRef<ReactEchartsRef>(null);
   const chartRef = forwardedRef || defaultRef;
@@ -296,7 +294,7 @@ function Chart({
       return getFormatter({
         isGroupedByDate: true,
         showTimeInTooltip: true,
-        utc,
+        utc: utc ?? false,
         valueFormatter: (value, seriesName) => {
           return tooltipFormatter(
             value,

diff --git a/static/app/views/starfish/views/mobileServiceView/index.tsx b/static/app/views/starfish/views/mobileServiceView/index.tsx
@@ -171,7 +171,6 @@ export function MobileStarfishView() {
               height={125}
               data={transformedSeries['avg(measurements.app_start_cold)']}
               loading={seriesIsLoading}
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',
@@ -199,7 +198,6 @@ export function MobileStarfishView() {
               data={transformedSeries['avg(measurements.app_start_warm)']}
               loading={seriesIsLoading}
               showLegend
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',
@@ -227,7 +225,6 @@ export function MobileStarfishView() {
               height={125}
               data={transformedSeries['avg(measurements.time_to_initial_display)']}
               loading={seriesIsLoading}
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',
@@ -254,7 +251,6 @@ export function MobileStarfishView() {
               data={transformedSeries['avg(measurements.time_to_full_display)']}
               loading={seriesIsLoading}
               showLegend
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',
@@ -282,7 +278,6 @@ export function MobileStarfishView() {
               height={125}
               data={transformedSeries['avg(measurements.frames_slow_rate)']}
               loading={seriesIsLoading}
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',
@@ -309,7 +304,6 @@ export function MobileStarfishView() {
               data={transformedSeries['avg(measurements.frames_frozen_rate)']}
               loading={seriesIsLoading}
               showLegend
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',

diff --git a/static/app/views/starfish/views/screens/screenLoadSpans/charts.tsx b/static/app/views/starfish/views/screens/screenLoadSpans/charts.tsx
@@ -265,7 +265,6 @@ export function ScreenCharts({yAxes, additionalFilters}: Props) {
                       transformedReleaseSeries[YAXIS_COLUMNS[yAxes[0]]]
                     )}
                     loading={isSeriesLoading}
-                    utc={false}
                     grid={{
                       left: '0',
                       right: '0',
@@ -334,7 +333,6 @@ export function ScreenCharts({yAxes, additionalFilters}: Props) {
                       transformedReleaseSeries[YAXIS_COLUMNS[yAxes[1]]]
                     )}
                     loading={isSeriesLoading}
-                    utc={false}
                     grid={{
                       left: '0',
                       right: '0',
@@ -377,7 +375,6 @@ export function ScreenCharts({yAxes, additionalFilters}: Props) {
                 data={Object.values(transformedReleaseSeries[YAXIS_COLUMNS[yAxes[2]]])}
                 height={245}
                 loading={isSeriesLoading}
-                utc={false}
                 grid={{
                   left: '0',
                   right: '0',

diff --git a/static/app/views/starfish/views/spanSummaryPage/sampleList/durationChart/index.tsx b/static/app/views/starfish/views/spanSummaryPage/sampleList/durationChart/index.tsx
@@ -225,7 +225,6 @@ function DurationChart({
               ? undefined
               : sampledSpanDataSeries
           }
-          utc={false}
           chartColors={[AVG_COLOR, 'black']}
           isLineChart
           definedAxisTicks={4}

diff --git a/static/app/views/starfish/views/spanSummaryPage/spanSummaryView.tsx b/static/app/views/starfish/views/spanSummaryPage/spanSummaryView.tsx
@@ -133,7 +133,6 @@ export function SpanSummaryView({groupId}: Props) {
               height={CHART_HEIGHT}
               data={[spanMetricsThroughputSeries]}
               loading={areSpanMetricsSeriesLoading}
-              utc={false}
               chartColors={[THROUGHPUT_COLOR]}
               isLineChart
               definedAxisTicks={4}
@@ -152,7 +151,6 @@ export function SpanSummaryView({groupId}: Props) {
               height={CHART_HEIGHT}
               data={[spanMetricsSeriesData?.[`avg(${SpanMetricsField.SPAN_SELF_TIME})`]]}
               loading={areSpanMetricsSeriesLoading}
-              utc={false}
               chartColors={[AVG_COLOR]}
               isLineChart
               definedAxisTicks={4}
@@ -167,7 +165,6 @@ export function SpanSummaryView({groupId}: Props) {
                 height={CHART_HEIGHT}
                 data={[spanMetricsSeriesData?.[`http_error_count()`]]}
                 loading={areSpanMetricsSeriesLoading}
-                utc={false}
                 chartColors={[ERRORS_COLOR]}
                 isLineChart
                 definedAxisTicks={4}

diff --git a/static/app/views/starfish/views/spans/spanTimeCharts.tsx b/static/app/views/starfish/views/spans/spanTimeCharts.tsx
@@ -158,7 +158,6 @@ function ThroughputChart({
       height={CHART_HEIGHT}
       data={throughputTimeSeries}
       loading={isLoading}
-      utc={false}
       grid={{
         left: '0',
         right: '0',
@@ -217,7 +216,6 @@ function DurationChart({moduleName, filters, extraQuery}: ChartProps): JSX.Eleme
       height={CHART_HEIGHT}
       data={[...avgSeries]}
       loading={isLoading}
-      utc={false}
       grid={{
         left: '0',
         right: '0',
@@ -251,7 +249,6 @@ function ErrorChart({moduleName, filters}: ChartProps): JSX.Element {
       height={CHART_HEIGHT}
       data={[errorRateSeries]}
       loading={isLoading}
-      utc={false}
       grid={{
         left: '0',
         right: '0',

diff --git a/static/app/views/starfish/views/webServiceView/endpointOverview/index.tsx b/static/app/views/starfish/views/webServiceView/endpointOverview/index.tsx
@@ -203,7 +203,6 @@ export default function EndpointOverview() {
             height={80}
             data={[percentileData, avgLine]}
             loading={loading}
-            utc={false}
             grid={{
               left: '8px',
               right: '0',
@@ -242,7 +241,6 @@ export default function EndpointOverview() {
             height={80}
             data={[throughputResults, tpsLine]}
             loading={loading}
-            utc={false}
             isLineChart
             definedAxisTicks={2}
             disableXAxis
@@ -285,7 +283,6 @@ export default function EndpointOverview() {
             height={80}
             data={[results['http_error_count()']]}
             loading={loading}
-            utc={false}
             grid={{
               left: '8px',
               right: '0',

diff --git a/static/app/views/starfish/views/webServiceView/spanGroupBreakdown.tsx b/static/app/views/starfish/views/webServiceView/spanGroupBreakdown.tsx
@@ -141,7 +141,6 @@ export function SpanGroupBreakdown({
             }
             errored={errored}
             loading={isTimeseriesLoading}
-            utc={false}
             onClick={handleModuleAreaClick}
             grid={{
               left: '0',

diff --git a/static/app/views/starfish/views/webServiceView/starfishView.tsx b/static/app/views/starfish/views/webServiceView/starfishView.tsx
@@ -143,7 +143,6 @@ export function StarfishView(props: BaseStarfishViewProps) {
               height={142}
               data={seriesByName[yAxis[2]]}
               loading={loading}
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',
@@ -166,7 +165,6 @@ export function StarfishView(props: BaseStarfishViewProps) {
               height={142}
               data={seriesByName[yAxis[0]]}
               loading={loading}
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',
@@ -192,7 +190,6 @@ export function StarfishView(props: BaseStarfishViewProps) {
               height={142}
               data={seriesByName[yAxis[1]]}
               loading={loading}
-              utc={false}
               grid={{
                 left: '0',
                 right: '0',