Merge pull request #16 from christinaor/c-feature-branch

OzairGh · web-flow · commit 4e79d0994a42 · 2022-07-18T11:52:03.000-05:00
Add comments for added Components graph in PerformanceVisx.tsx
diff --git a/src/app/components/BarGraph.tsx b/src/app/components/BarGraph.tsx
@@ -140,6 +140,7 @@ const BarGraph = props => {
     }
   });
 
+  // CURRENTLY DOES NOT SAVE
   const saveSeriesClickHandler = () => {
     if (tabs[currentTab].seriesSavedStatus === 'inputBoxOpen') {
       const actionNames = document.getElementsByClassName('actionname');
@@ -153,7 +154,7 @@ const BarGraph = props => {
     dispatch(save(toStorage));
   };
 
-  // FTRI9 note - need to ensure text box is not empty before saving
+  // Need to change so textbox isn't empty before saving
   const textbox = tabs[currentTab].seriesSavedStatus === 'inputBoxOpen' ? <input type="text" id="seriesname" placeholder="Enter Series Name" onChange={e => setSeriesNameInput(e.target.value)} /> : null;
   return (
     <div className="bargraph-position">
diff --git a/src/app/components/PerformanceVisx.tsx b/src/app/components/PerformanceVisx.tsx
@@ -254,15 +254,14 @@ const PerformanceVisx = (props: BarStackProps) => {
     data.barStack = filteredSnapshots;
   }
 
-  if (snapshot !== 'All Snapshots') {
-    // filter barStack to make it equal to an array of length 1 with object matching snapshot ID
 
+  if (snapshot !== 'All Snapshots') {
+    // filter barStack to make it equal to an array of length 1 with object matching snapshot ID to mirror the data.barStack object's shape
     const checkData = [data.barStack.find(comp => comp.snapshotId === snapshot)];
     const holdData = [];
     // maxheight is referring to the max height in render time to choose the scaling size for graph
     let maxHeight = 0;
-    /* looping through checkData which is composed of a single snapshot
-       while pushing key/values to a new object and setting maxHeight */
+    // looping through checkData which is composed of a single snapshot while pushing key/values to a new object and setting maxHeight
     for (const key in checkData[0]) {
       if (key !== 'route' && key !== 'snapshotId') {
         if (maxHeight < checkData[0][key]) maxHeight = checkData[0][key];
@@ -273,6 +272,8 @@ const PerformanceVisx = (props: BarStackProps) => {
         holdData[holdData.length - 1].snapshotId = key;
       }
     }
+    // maxTotalRender height of bar is aligned to y-axis
+    // 1.15 adjusts the numbers on the y-axis so the max bar's true height never reaches the max of the y-axis
     data.maxTotalRender = maxHeight * 1.15;
     if (holdData) data.barStack = holdData;
   }
diff --git a/src/extension/build/panel.html b/src/extension/build/panel.html
@@ -1,14 +1,14 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
-    <title>Reactime 15.0</title>
-  </head>
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+        <title>Reactime 15.0</title>
+    </head>
 
-  <body>
-    <div id="root"></div>
-    <script type="text/javascript" src="bundles/app.bundle.js"></script>
-  </body>
+    <body>
+        <div id="root"></div>
+        <script type="text/javascript" src="bundles/app.bundle.js"></script>
+    </body>
 </html>
