Start using const enum (#5879)

We can use typescript const enums for SelectedState and for resource
types.

Author: mstange

src/components/shared/thread/ActivityGraphFills.tsx

@@ -10,11 +10,11 @@ import type {
   IndexIntoSamplesTable,
   IndexIntoCategoryList,
   Thread,
-  SelectedState,
   Milliseconds,
   DevicePixels,
   CssPixels,
 } from 'firefox-profiler/types';
+import { SelectedState } from 'firefox-profiler/types';
 import type { HoveredPixelState } from './ActivityGraph';
 
 /**
@@ -357,13 +357,13 @@ export class ActivityGraphFillComputer {
       return percentageBuffers.selectedPercentageAtPixel;
     }
     switch (samplesSelectedStates[sampleIndex]) {
-      case 'FILTERED_OUT_BY_TRANSFORM':
+      case SelectedState.FilteredOutByTransform:
         return percentageBuffers.filteredOutByTransformPercentageAtPixel;
-      case 'UNSELECTED_ORDERED_BEFORE_SELECTED':
+      case SelectedState.UnselectedOrderedBeforeSelected:
         return percentageBuffers.beforeSelectedPercentageAtPixel;
-      case 'SELECTED':
+      case SelectedState.Selected:
         return percentageBuffers.selectedPercentageAtPixel;
-      case 'UNSELECTED_ORDERED_AFTER_SELECTED':
+      case SelectedState.UnselectedOrderedAfterSelected:
         return percentageBuffers.afterSelectedPercentageAtPixel;
       default:
         throw new Error('Unexpected samplesSelectedStates value');
@@ -768,10 +768,10 @@ function _createSelectedPercentageAtPixelBuffers({
  * For each category, create a fill style for each of 4 draw states. These fill styles
  * are sorted by their gravity.
  *
- * 'UNSELECTED_ORDERED_BEFORE_SELECTED',
- * 'SELECTED',
- * 'UNSELECTED_ORDERED_AFTER_SELECTED',
- * 'FILTERED_OUT_BY_TRANSFORM'
+ * SelectedState.UnselectedOrderedBeforeSelected,
+ * SelectedState.Selected,
+ * SelectedState.UnselectedOrderedAfterSelected,
+ * SelectedState.FilteredOutByTransform
  */
 function _getCategoryFills(
   categoryDrawStyles: CategoryDrawStyles,

src/components/shared/thread/HeightGraph.tsx

@@ -15,8 +15,8 @@ import type {
   CategoryList,
   IndexIntoSamplesTable,
   Milliseconds,
-  SelectedState,
 } from 'firefox-profiler/types';
+import { SelectedState } from 'firefox-profiler/types';
 
 type Props = {
   readonly heightFunc: (param: IndexIntoSamplesTable) => number | null;
@@ -138,7 +138,7 @@ export class ThreadHeightGraph extends PureComponent<Props> {
       let samplesBucket;
       if (
         samplesSelectedStates !== null &&
-        samplesSelectedStates[i] === 'SELECTED'
+        samplesSelectedStates[i] === SelectedState.Selected
       ) {
         samplesBucket = highlightedSamples;
       } else {

src/components/shared/thread/SampleGraph.tsx

@@ -24,11 +24,11 @@ import type {
   CategoryList,
   IndexIntoSamplesTable,
   Milliseconds,
-  SelectedState,
   CssPixels,
   TimelineType,
   ImplementationFilter,
 } from 'firefox-profiler/types';
+import { SelectedState } from 'firefox-profiler/types';
 import type { SizeProps } from 'firefox-profiler/components/shared/WithSize';
 import type { CpuRatioInTimeRange } from './ActivityGraphFills';
 import { lightDark } from 'firefox-profiler/utils/dark-mode';
@@ -197,7 +197,7 @@ class ThreadSampleGraphCanvas extends React.PureComponent<CanvasProps> {
       let samplesBucket;
       if (
         samplesSelectedStates !== null &&
-        samplesSelectedStates[i] === 'SELECTED'
+        samplesSelectedStates[i] === SelectedState.Selected
       ) {
         samplesBucket = highlightedSamples;
       } else {

src/profile-logic/bottom-box.ts

@@ -2,7 +2,7 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-import { resourceTypes } from './data-structures';
+import { ResourceType } from 'firefox-profiler/types';
 
 import type {
   Thread,
@@ -49,7 +49,7 @@ export function getBottomBoxInfoForCallNode(
   const sourceIndex = funcTable.source[funcIndex];
   const resource = funcTable.resource[funcIndex];
   const libIndex =
-    resource !== -1 && resourceTable.type[resource] === resourceTypes.library
+    resource !== -1 && resourceTable.type[resource] === ResourceType.Library
       ? resourceTable.lib[resource]
       : null;
   const callNodeFramePerStack = getCallNodeFramePerStack(
@@ -152,7 +152,7 @@ export function getBottomBoxInfoForStackFrame(
   const sourceIndex = funcTable.source[funcIndex];
   const resource = funcTable.resource[funcIndex];
   const libIndex =
-    resource !== -1 && resourceTable.type[resource] === resourceTypes.library
+    resource !== -1 && resourceTable.type[resource] === ResourceType.Library
       ? resourceTable.lib[resource]
       : null;
 

src/profile-logic/call-tree.ts

@@ -7,7 +7,6 @@ import {
   getOriginAnnotationForFunc,
   getCategoryPairLabel,
 } from './profile-data';
-import { resourceTypes } from './data-structures';
 import { getFunctionName } from './function-info';
 import type {
   CategoryList,
@@ -28,6 +27,7 @@ import type {
   SelfAndTotal,
   BalancedNativeAllocationsTable,
 } from 'firefox-profiler/types';
+import { ResourceType } from 'firefox-profiler/types';
 
 import ExtensionIcon from '../../res/img/svg/extension.svg';
 import { formatCallNodeNumber, formatPercent } from '../utils/format-numbers';
@@ -511,9 +511,9 @@ export class CallTree {
       let iconSrc = null;
       let icon = null;
 
-      if (resourceType === resourceTypes.webhost) {
+      if (resourceType === ResourceType.Webhost) {
         icon = iconSrc = extractFaviconFromLibname(libName);
-      } else if (resourceType === resourceTypes.addon) {
+      } else if (resourceType === ResourceType.Addon) {
         iconSrc = ExtensionIcon;
 
         const resourceNameIndex =

src/profile-logic/data-structures.ts

@@ -299,15 +299,6 @@ export function shallowCloneRawMarkerTable(
   };
 }
 
-export const resourceTypes = {
-  unknown: 0,
-  library: 1,
-  addon: 2,
-  webhost: 3,
-  otherhost: 4,
-  url: 5,
-};
-
 export function getEmptyExtensions(): ExtensionTable {
   return {
     // Important!

src/profile-logic/global-data-collector.ts

@@ -10,7 +10,6 @@ import {
   getEmptyRawStackTable,
   getEmptyResourceTable,
   getEmptySourceTable,
-  resourceTypes,
 } from './data-structures';
 
 import type {
@@ -33,6 +32,7 @@ import type {
   Address,
   Bytes,
 } from 'firefox-profiler/types';
+import { ResourceType } from 'firefox-profiler/types';
 
 /**
  * GlobalDataCollector collects data which is global in the processed profile
@@ -163,7 +163,7 @@ export class GlobalDataCollector {
         resourceTable.name[resourceIndex] =
           this._stringTable.indexForString(name);
         resourceTable.host[resourceIndex] = idIndex;
-        resourceTable.type[resourceIndex] = resourceTypes.addon;
+        resourceTable.type[resourceIndex] = ResourceType.Addon;
       }
     }
   }
@@ -208,15 +208,15 @@ export class GlobalDataCollector {
         this._stringTable.indexForString(origin);
       resourceTable.host[resourceIndex] =
         this._stringTable.indexForString(host);
-      resourceTable.type[resourceIndex] = resourceTypes.webhost;
+      resourceTable.type[resourceIndex] = ResourceType.Webhost;
     } else {
       // This is a URL, but it doesn't point to something on the web, e.g. a
       // chrome url.
       resourceTable.lib[resourceIndex] = null;
       resourceTable.name[resourceIndex] =
         this._stringTable.indexForString(scriptURI);
       resourceTable.host[resourceIndex] = null;
-      resourceTable.type[resourceIndex] = resourceTypes.url;
+      resourceTable.type[resourceIndex] = ResourceType.Url;
     }
     return resourceIndex;
   }
@@ -236,7 +236,7 @@ export class GlobalDataCollector {
       this._libs[libIndex].name
     );
     resourceTable.host[resourceIndex] = null;
-    resourceTable.type[resourceIndex] = resourceTypes.library;
+    resourceTable.type[resourceIndex] = ResourceType.Library;
     return resourceIndex;
   }
 
@@ -255,7 +255,7 @@ export class GlobalDataCollector {
     resourceTable.lib[resourceIndex] = null;
     resourceTable.name[resourceIndex] = libNameStringIndex;
     resourceTable.host[resourceIndex] = null;
-    resourceTable.type[resourceIndex] = resourceTypes.library;
+    resourceTable.type[resourceIndex] = ResourceType.Library;
     return resourceIndex;
   }
 

src/profile-logic/process-profile.ts

@@ -287,7 +287,7 @@ export function extractFuncsAndResourcesFromFrameLocations(
  * address.
  * We also associate the address with the library that contains it, and convert the address
  * into a library-relative offset. This association is established via the function's
- * "resource": The function points to the resource (of type resourceTypes.library), and the
+ * "resource": The function points to the resource (of type ResourceType.Library), and the
  * resource has the index to the library in thread.libs.
  * We return the index of the newly-added function, and the address as a library-relative
  * offset.

src/profile-logic/processed-profile-versioning.ts

@@ -14,7 +14,7 @@
  */
 
 import { sortDataTable } from '../utils/data-table-utils';
-import { resourceTypes } from './data-structures';
+import { ResourceType } from 'firefox-profiler/types';
 import { StringTable } from '../utils/string-table';
 import { timeCode } from '../utils/time-code';
 import { PROCESSED_PROFILE_VERSION } from '../app-logic/constants';
@@ -356,19 +356,19 @@ const _upgraders: {
       };
       function addLibResource(name: number, lib: number) {
         const index = newResourceTable.length++;
-        newResourceTable.type[index] = resourceTypes.library;
+        newResourceTable.type[index] = ResourceType.Library;
         newResourceTable.name[index] = name;
         newResourceTable.lib[index] = lib;
       }
       function addWebhostResource(origin: number, host: number) {
         const index = newResourceTable.length++;
-        newResourceTable.type[index] = resourceTypes.webhost;
+        newResourceTable.type[index] = ResourceType.Webhost;
         newResourceTable.name[index] = origin;
         newResourceTable.host[index] = host;
       }
       function addUrlResource(url: number) {
         const index = newResourceTable.length++;
-        newResourceTable.type[index] = resourceTypes.url;
+        newResourceTable.type[index] = ResourceType.Url;
         newResourceTable.name[index] = url;
       }
       const oldResourceToNewResourceMap = new Map();
@@ -378,7 +378,7 @@ const _upgraders: {
         resourceIndex < resourceTable.length;
         resourceIndex++
       ) {
-        if (resourceTable.type[resourceIndex] === resourceTypes.library) {
+        if (resourceTable.type[resourceIndex] === ResourceType.Library) {
           oldResourceToNewResourceMap.set(
             resourceIndex,
             newResourceTable.length
@@ -387,7 +387,7 @@ const _upgraders: {
             resourceTable.name[resourceIndex],
             resourceTable.lib[resourceIndex]
           );
-        } else if (resourceTable.type[resourceIndex] === resourceTypes.url) {
+        } else if (resourceTable.type[resourceIndex] === ResourceType.Url) {
           const scriptURI = stringTable.getString(
             resourceTable.name[resourceIndex]
           );
@@ -1810,7 +1810,7 @@ const _upgraders: {
           continue;
         }
         const resourceType = resourceTable.type[resourceIndex];
-        if (resourceType !== resourceTypes.library) {
+        if (resourceType !== ResourceType.Library) {
           continue;
         }
         const libIndex = resourceTable.lib[resourceIndex];