Remove timeline graph type radio buttons

locales/en-US/app.ftl

@@ -223,11 +223,6 @@ FooterLinks--hide-button =
 ## The timeline component of the full view in the analysis UI at the top of the
 ## page.
 
-FullTimeline--graph-type = Graph type:
-FullTimeline--categories-with-cpu = Categories with CPU
-FullTimeline--categories = Categories
-FullTimeline--stack-height = Stack height
-
 # This string is used as the text of the track selection button.
 # Displays the ratio of visible tracks count to total tracks count in the timeline.
 # We have spans here to make the numbers bold.

src/actions/receive-profile.js

@@ -33,7 +33,6 @@ import {
   getProfile,
   getView,
   getRelevantPagesForActiveTab,
-  getIsCPUUtilizationProvided,
   getSymbolServerUrl,
   getActiveTabID,
 } from 'firefox-profiler/selectors';
@@ -58,6 +57,7 @@ import { computeActiveTabTracks } from 'firefox-profiler/profile-logic/active-ta
 import { setDataSource } from './profile-view';
 import { fatalError } from './errors';
 import { GOOGLE_STORAGE_BUCKET } from 'firefox-profiler/app-logic/constants';
+import { determineTimelineType } from 'firefox-profiler/profile-logic/profile-data';
 
 import type {
   RequestedLib,
@@ -335,20 +335,9 @@ export function finalizeFullProfileView(
       profile
     );
 
-    // Check the profile to see if we have threadCPUDelta values and switch to
-    // the category view with CPU if we have. This is needed only while we are
-    // still experimenting with the new activity graph. We should remove this
-    // when we have this on by default.
     let timelineType = null;
-    if (
-      !hasUrlInfo &&
-      profile.meta.sampleUnits &&
-      profile.threads.some((thread) => thread.samples.threadCPUDelta)
-    ) {
-      const hasCPUDeltaValues = getIsCPUUtilizationProvided(getState());
-      if (hasCPUDeltaValues) {
-        timelineType = 'cpu-category';
-      }
+    if (!hasUrlInfo) {
+      timelineType = determineTimelineType(profile);
     }
 
     withHistoryReplaceStateSync(() => {
@@ -588,15 +577,8 @@ export function finalizeActiveTabProfileView(
     // still experimenting with the new activity graph. We should remove this
     // when we have this on by default.
     let timelineType = null;
-    if (
-      !hasUrlInfo &&
-      profile.meta.sampleUnits &&
-      profile.threads[0].samples.threadCPUDelta
-    ) {
-      const hasCPUDeltaValues = getIsCPUUtilizationProvided(getState());
-      if (hasCPUDeltaValues) {
-        timelineType = 'cpu-category';
-      }
+    if (!hasUrlInfo) {
+      timelineType = determineTimelineType(profile);
     }
 
     dispatch({

src/app-logic/constants.js

@@ -18,8 +18,6 @@ export const TIMELINE_MARGIN_RIGHT = 15;
 export const TIMELINE_MARGIN_LEFT = 150;
 export const ACTIVE_TAB_TIMELINE_MARGIN_LEFT = 0;
 
-export const TIMELINE_SETTINGS_HEIGHT = 26;
-
 // Export the value for tests, and for computing the max height of the timeline
 // for the splitter.
 export const FULL_TRACK_SCREENSHOT_HEIGHT = 50;

src/app-logic/url-handling.js

@@ -46,7 +46,7 @@ import {
 } from '../utils/uintarray-encoding';
 import { tabSlugs } from '../app-logic/tabs-handling';
 
-export const CURRENT_URL_VERSION = 6;
+export const CURRENT_URL_VERSION = 7;
 
 /**
  * This static piece of state might look like an anti-pattern, but it's a relatively
@@ -366,10 +366,9 @@ export function getQueryStringFromUrlState(urlState: UrlState): string {
         ? undefined
         : urlState.profileSpecific.implementation,
     timelineType:
-      // The default is the category view, so only add it to the URL if it's the
-      // stack or cpu-category view.
-      // TODO: We should make the 'cpu-category' the new default with an upgrader.
-      urlState.profileSpecific.timelineType === 'category'
+      // The default is the cpu-category view, so only add it to the URL if it's
+      // the stack or category view.
+      urlState.profileSpecific.timelineType === 'cpu-category'
         ? undefined
         : urlState.profileSpecific.timelineType,
   }: BaseQueryShape);
@@ -1088,6 +1087,26 @@ const _upgraders: {|
       delete query.transforms;
     }
   },
+  [7]: ({ query }: ProcessedLocationBeforeUpgrade) => {
+    // Default timeline type has been changed to 'cpu-category' from 'category'.
+    // Default timeline type isn't needed to be in the url, revert the values in
+    // the query to reflect that.
+    switch (query.timelineType) {
+      case 'cpu-category':
+        // This is the default value now. It's not needed in the url.
+        delete query.timelineType;
+        break;
+      case 'stack':
+        // Do nothing for this.
+        break;
+      case 'category':
+      default:
+        // We can either have 'category' or nothing for this value. We should
+        // explicitly add for this case.
+        query.timelineType = 'category';
+        break;
+    }
+  },
 };
 
 for (let destVersion = 1; destVersion <= CURRENT_URL_VERSION; destVersion++) {
@@ -1213,6 +1232,6 @@ function validateTimelineType(type: ?string): TimelineType {
     default:
       // Type assert we've checked everything:
       (timelineType: empty);
-      return 'category';
+      return 'cpu-category';
   }
 }

src/components/shared/thread/ActivityGraph.js

@@ -26,6 +26,7 @@ import type {
   SelectedState,
   Milliseconds,
   CssPixels,
+  TimelineType,
 } from 'firefox-profiler/types';
 import type {
   ActivityFillGraphQuerier,
@@ -54,6 +55,7 @@ export type Props = {|
   +enableCPUUsage: boolean,
   +maxThreadCPUDeltaPerMs: number,
   +implementationFilter: ImplementationFilter,
+  +timelineType: TimelineType,
   ...SizeProps,
 |};
 
@@ -169,6 +171,7 @@ class ThreadActivityGraphImpl extends React.PureComponent<Props, State> {
       implementationFilter,
       width,
       height,
+      timelineType,
     } = this.props;
     const { hoveredPixelState, mouseX, mouseY } = this.state;
     return (
@@ -204,7 +207,11 @@ class ThreadActivityGraphImpl extends React.PureComponent<Props, State> {
           <Tooltip mouseX={mouseX} mouseY={mouseY}>
             <SampleTooltipContents
               sampleIndex={hoveredPixelState.sample}
-              cpuRatioInTimeRange={hoveredPixelState.cpuRatioInTimeRange}
+              cpuRatioInTimeRange={
+                timelineType === 'cpu-category'
+                  ? hoveredPixelState.cpuRatioInTimeRange
+                  : null
+              }
               rangeFilteredThread={rangeFilteredThread}
               categories={categories}
               implementationFilter={implementationFilter}