adjusted positioning of bar graph and ax tree

Author: garrettlchow

src/app/components/StateRoute/AxMap/Ax.tsx

@@ -13,9 +13,9 @@ import { toggleExpanded, setCurrentTabInApp } from '../../../slices/mainSlice';
 
 const defaultMargin = {
   top: 30,
-  left: 30,
-  right: 55,
-  bottom: 70,
+  left: 20,
+  right: 50,
+  bottom: 20,
 };
 
 const nodeCoords: object = {};

src/app/components/StateRoute/PerformanceVisx/BarGraph.tsx

@@ -111,7 +111,7 @@ const BarGraph = (props: BarGraphProps): JSX.Element => {
   // setting max dimensions and scale ranges
   const xMax = width - margin.left - margin.right;
   snapshotIdScale.rangeRound([0, xMax]);
-  const yMax = height - margin.top - 150;
+  const yMax = height - margin.top - 100;
   renderingScale.range([yMax, 0]);
 
   const toStorage = {

src/app/containers/MainContainer.tsx

@@ -46,12 +46,17 @@ function MainContainer(): JSX.Element {
   }) => {
     let maxTab: number;
 
+    // Add validation check
     if (!sourceTab && action !== 'keepAlive') {
-      // if the sourceTab doesn't exist or is 0 and it is not a 'keepAlive' action
-      const tabsArray: Array<string> = Object.keys(payload); // we create a tabsArray of strings composed of keys from our payload object
-      const numTabsArray: number[] = tabsArray.map((tab) => Number(tab)); // we then map out our tabsArray where we convert each string into a number
-
-      maxTab = Math.max(...numTabsArray); // we then get the largest tab number value
+      // Ensure payload exists and is an object
+      if (payload && typeof payload === 'object') {
+        const tabsArray = Object.keys(payload);
+        const numTabsArray = tabsArray.map((tab) => Number(tab));
+        maxTab = numTabsArray.length > 0 ? Math.max(...numTabsArray) : 0;
+      } else {
+        console.warn('Invalid payload received:', payload);
+        maxTab = 0;
+      }
     }
 
     switch (action) {
@@ -73,7 +78,6 @@ function MainContainer(): JSX.Element {
       }
       case 'sendSnapshots': {
         dispatch(setTab(payload));
-        // set state with the information received from the background script
         dispatch(addNewSnapshots(payload));
         break;
       }