Removed console logs and any outdated comments

Co-authored-by: AndrewByun <[email protected]>
Co-authored-by: ctstamper <[email protected]>
Co-authored-by: kelvinmirhan <[email protected]>

Author: 4 people

src/app/RTKslices.tsx

@@ -24,7 +24,6 @@ const findName = (index, obj) => {
       objChildArray.push(findName(index, objChild));
     }
   }
-  console.log(objChildArray);
   // eslint-disable-next-line no-restricted-syntax
   for (const objChildName of objChildArray) {
     if (objChildName) {
@@ -40,36 +39,37 @@ export const mainSlice = createSlice({
 
     emptySnapshots: (state) => {
       const { tabs, currentTab, port } = state;
-      console.log("this is state 2", current(state));
 
-      port.postMessage({ action: 'emptySnap', tabId: currentTab });
+      port.postMessage({ action: 'emptySnap', tabId: currentTab }); //communicate with background.js (service worker)
 
+      // properties associated with timetravel + seek bar
       tabs[currentTab].sliderIndex = 0;
       tabs[currentTab].viewIndex = 0;
       tabs[currentTab].playing = false;
 
-      const lastSnapshot = tabs[currentTab].snapshots[tabs[currentTab].snapshots.length - 1];
+      const lastSnapshot = tabs[currentTab].snapshots[tabs[currentTab].snapshots.length - 1]; // the most recent snapshot
 
-      tabs[currentTab].hierarchy.stateSnapshot = { ...lastSnapshot };
-      tabs[currentTab].hierarchy.children = [];
-      tabs[currentTab].snapshots = [lastSnapshot];
+      tabs[currentTab].hierarchy.stateSnapshot = { ...lastSnapshot }; // resets hierarchy to page last state recorded
+      tabs[currentTab].hierarchy.children = []; // resets hierarchy
+      tabs[currentTab].snapshots = [lastSnapshot]; // resets snapshots to page last state recorded
 
+      // resets currLocation to page last state recorded
       tabs[currentTab].currLocation = tabs[currentTab].hierarchy;
-      console.log('tabsHieracyh', tabs[currentTab].hierarchy);
       tabs[currentTab].index = 1;
       tabs[currentTab].currParent = 0;
       tabs[currentTab].currBranch = 1;
       tabs[currentTab].seriesSavedStatus = false;
     },
 
     addNewSnapshots: (state, action) => {
-      const { tabs } = state;
+      const { tabs, currentTab } = state;
 
       const { payload } = action;
       Object.keys(tabs).forEach(tab => {
         if (!payload[tab])
           delete tabs[tab];
         else {
+          // maintain isExpanded prop from old stateSnapshot to preserve componentMap expansion
           const persistIsExpanded = (newNode, oldNode) => {
             newNode.isExpanded = oldNode ? oldNode.isExpanded : true;
             if (newNode.children) {
@@ -91,6 +91,10 @@ export const mainSlice = createSlice({
           };
         }
       });
+
+      // only set first tab if current tab is non existent
+      const firstTab = parseInt(Object.keys(payload)[0], 10);
+      if (currentTab === undefined || currentTab === null) state.currentTab = firstTab;
     },
 
     initialConnect: (state, action) => {
@@ -117,9 +121,7 @@ export const mainSlice = createSlice({
     },
 
     setPort: (state, action) => {
-      console.log('port start: ', current(state))
       state.port = action.payload;
-      console.log('port end: ', current(state))
     },
 
     setTab: (state, action) => {
@@ -174,43 +176,18 @@ export const mainSlice = createSlice({
 
     changeView: (state, action) => {
       const {tabs, currentTab} = state;
-      console.log('this is state:', current(state))
-      console.log('this is tabs:', tabs)
-      console.log('this is currentabs:', currentTab)
-      console.log('this is tabs[currentab]', tabs[currentTab])
       const {viewIndex} = tabs[currentTab] || {};
-      console.log('hi this is viewIndex:', viewIndex);
-      console.log('this is action payload', action.payload)
+      // unselect view if same index was selected
       tabs[currentTab].viewIndex = viewIndex === action.payload ? -1 : action.payload;
-        // if (viewIndex === action.payload) tabs[currentTab].viewIndex = -1;
-        // else tabs[currentTab].viewIndex = action.payload;
-        // tabs[currentTab].currLocation = tabs[currentTab].hierarchy;
-
-    //  case types.CHANGE_VIEW: {
-    //     // unselect view if same index was selected
-    //     // console.log('action:', action)
-    //     // console.log('state: ', state)
-    //     if (viewIndex === action.payload) tabs[currentTab].viewIndex = -1;
-    //     else tabs[currentTab].viewIndex = action.payload;
-    //     // update currLocation
-    //     // tabs[currentTab].currLocation = tabs[currentTab].hierarchy;
-    //     break;
-    //   }
-
     },
 
     changeSlider: (state, action) => {
       const { port, currentTab, tabs } = state;
       const { hierarchy, snapshots } = tabs[currentTab] || {};
 
-      console.log('this is PORT', port);
-      console.log('this is hierarchy', hierarchy);
-      console.log('this is SNapshots', snapshots);
-
+      // finds the name by the action.payload parsing through the hierarchy to send to background.js the current name in the jump action
       const nameFromIndex = findName(action.payload, hierarchy);
-
-      // console.log('this is action payload', action.payload);
-      // console.log('this is nameFromIndex', nameFromIndex);
+      // nameFromIndex is a number based on which jump button is pushed
 
       port.postMessage({
         action: 'jumpToSnap',
@@ -234,8 +211,6 @@ export const mainSlice = createSlice({
       clearInterval(intervalId);
       tabs[currentTab].playing = false;
       tabs[currentTab].intervalId = null;
-      console.log('pause: state end', current(state));
-
     },
 
     launchContentScript: (state, action) => {
@@ -408,7 +383,7 @@ export const mainSlice = createSlice({
 
     tutorialSaveSeriesToggle: (state, action) => {
       const { tabs, currentTab } = state;
-      tabs[currentTab] = { ...tabs[currentTab], seriesSavedStatus: action.payload }
+      tabs[currentTab] = { ...tabs[currentTab], seriesSavedStatus: action.payload } // sets the tab[currentTab]'s 'seriesSavedStatus' property to the payload.
     },
 
     onHover: (state, action) => {
@@ -437,7 +412,6 @@ export const mainSlice = createSlice({
       const { newSeries, newSeriesName } = action.payload;
         if (!tabs[currentTab].seriesSavedStatus) {
           tabs[currentTab] = { ...tabs[currentTab], seriesSavedStatus: 'inputBoxOpen' };
-          //testing return to fix save functionality
           return;
         }
         // Runs if series name input box is active.
@@ -449,7 +423,6 @@ export const mainSlice = createSlice({
           seriesArray.push(newSeries);
           localStorage.setItem('project', JSON.stringify(seriesArray));
           tabs[currentTab] = { ...tabs[currentTab], seriesSavedStatus: 'saved' };
-          //testing return to fix save functionality instead of break
           return;
         }
     },

src/app/__tests__/ButtonContainer.test.tsx

@@ -176,7 +176,6 @@ describe('Unit testing for ButtonContainer', () => {
     test('it should have 5 buttons', () => {
       customInitialState.main.connectionStatus = true;
       render(<ButtonsContainer />);
-      // console.log(screen.getAllByRole('button')[4])
       expect(screen.getAllByRole('button')).toHaveLength(5);
       expect(screen.getAllByRole('button')[0]).toHaveTextContent('Locked');
       expect(screen.getAllByRole('button')[1]).toHaveTextContent('Download');

src/app/__tests__/TravelForwardBackward.test.tsx

@@ -152,7 +152,6 @@ jest.mock('react-redux', () => ({
 
     test('Clicking < Button button will trigger button', () => {
       let buttons = screen.getAllByRole('button');
-      console.log(buttons);
       fireEvent.click(buttons[1]);
       expect(dummyDispatch).toHaveBeenCalledTimes(1);
     });

src/app/components/StateRoute/History.tsx

@@ -185,7 +185,6 @@ function History(props: Record<string, unknown>): JSX.Element {
       .style('cursor', 'pointer')
       .attr('class', `snapshotNode`)
       .on('click', (event, d) => {
-        console.log('d.data.index: ', d.data.index)
         dispatch(changeView(d.data.index));
         dispatch(changeSlider(d.data.index));
         /*

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

@@ -111,16 +111,11 @@ const BarGraph = (props: BarGraphProps): JSX.Element => {
   });
 
   const saveSeriesClickHandler = () => { // function to save the currently selected series
-    console.log('we are in save series click handler')
     if (tabs[currentTab].seriesSavedStatus === 'inputBoxOpen') {
-      console.log('we are inside the conditional within saveSeriesClickHandler')
-      console.log('this is the comparison.length', comparison.length)
       const actionNames = document.getElementsByClassName('actionname');
       for (let i = 0; i < actionNames.length; i += 1) {
         toStorage.data.barStack[i].name = actionNames[i].value;
       }
-      console.log('this is seriesnameINput', seriesNameInput);
-      console.log('this is toStorage', toStorage);
       dispatch(save({ newSeries: toStorage, newSeriesName: seriesNameInput })); // saves the series under seriesName
       setSeriesNameInput(`Series ${comparison.length}`); // sends a reducer that saves the series/toStorage object the user wants to chrome local storage
       return;

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

@@ -122,7 +122,6 @@ const traverse = (snapshot, data, snapshots, currTotalRender: currNum = 0): void
 const allStorage = (): Series[] => {
   let values = localStorage.getItem('project');
   const newValues: Series[] = values === null ? [] : JSON.parse(values);
-  console.log('this is newValues', newValues);
   return newValues;
 };
 

src/app/components/StateRoute/StateRoute.tsx

@@ -114,7 +114,6 @@ const StateRoute = (props: StateRouteProps) => {
     if (webMetrics.INP <= 200) INPColor = '#0bce6b';
     if (webMetrics.INP <= 500) INPColor = '#E56543';
     if (webMetrics.INP > 500) INPColor = '#fc2000';
-    console.log('WEBMETRICS YOOO', webMetrics);
 
     return (
       <div className='web-metrics-container'>

src/app/containers/MainContainer.tsx

@@ -48,53 +48,13 @@ function MainContainer(): JSX.Element {
     }
   };
 
-
-
-
+  // Function handles when Reactime unexpectedly disconnects
   const handleDisconnect = (msg): void => {
-    if (msg === 'portDisconnect') {
-      console.log('unexpected port disconnection');
+    if (msg === 'portDisconnect')
       dispatch(disconnected());
-    }
-  }
-
-  const handleConnect = () => {
-    const maxRetries = 10;
-    const retryInterval = 1000;
-    const maxTimeout = 15000;
-
-    return new Promise((resolve) => {
-      let port: chrome.runtime.Port;
-      console.log('init port: ', port)
-
-      const attemptReconnection = (retries: number, startTime: number) => {
-        // console.log('WORKING')
-        if (retries <= maxRetries && Date.now() - startTime < maxTimeout) {
-          if (retries === 1)
-            port = chrome.runtime.connect();
-          // console.log('HITTING IF');
-          chrome.runtime.sendMessage({ action: 'attemptReconnect' }, (response) => {
-            if (response && response.success) {
-              console.log('Reconnect Success: ', response.success);
-              resolve(port);
-            } else {
-              console.log('Reconnect failed: ', !response && response.success);
-    
-              setTimeout(() => {
-                console.log('trying!', retries)
-                attemptReconnection(retries + 1, startTime);
-              }, retryInterval);
-            }
-          });
-        } else {
-          console.log('PORT CONNECT FAILED');
-          resolve(null);
-        }
-      };
-      attemptReconnection(1, Date.now());
-    });
   }
 
+  // Function to listen for a message containing snapshots from the /extension/build/background.js service worker
   const messageListener = (message: { 
     action: string; 
     payload: Record<string, unknown>; 
@@ -120,7 +80,6 @@ function MainContainer(): JSX.Element {
         break;
       }
       case 'changeTab': {
-        console.log('received changeTab message')
         dispatch(setTab(payload));
         break;
       }
@@ -145,18 +104,21 @@ function MainContainer(): JSX.Element {
   useEffect(() => {
     if (port) return; // only open port once so if it exists, do not run useEffect again
 
+    // Connect ot port and assign evaluated result (obj) to currentPort
     const currentPort = chrome.runtime.connect();
 
-    while (chrome.runtime.onMessage.hasListener(messageListener))
-      chrome.runtime.onMessage.removeListener(messageListener);
+    // If messageListener exists on currentPort, remove it
+    while (currentPort.onMessage.hasListener(messageListener))
+      currentPort.onMessage.removeListener(messageListener);
 
-    // listen for a message containing snapshots from the /extension/build/background.js service worker
+    // Add messageListener to the currentPort
     currentPort.onMessage.addListener(messageListener);
 
+    // If handleDisconnect exists on chrome.runtime, remove it
     while (chrome.runtime.onMessage.hasListener(handleDisconnect))
       chrome.runtime.onMessage.removeListener(handleDisconnect);
 
-    // used to track when the above connection closes unexpectedly. Remember that it should persist throughout the application lifecycle
+    // add handleDisconnect to chrome.runtime
     chrome.runtime.onMessage.addListener(handleDisconnect);
 
     // assign port to state so it could be used by other components