Merge branch 'additionalMui' of https://github.com/oslabs-beta/reactime into additionalMui

Author: KyEBell

src/app/FrontendTypes.ts

@@ -79,7 +79,7 @@ export interface BarGraphBase {
 
 export interface BarGraphComparisonProps extends BarGraphBase {
   setSeries: (e: boolean | string) => void;
-  series: number | boolean; // was number 8/3/2023
+  series: number;
   setAction: (e: boolean | string) => void;
 }
 

src/app/components/App.tsx

@@ -13,8 +13,7 @@ import theme from './theme';
   This is used to determine the proper tutorial to render when How To button is pressed.
 */
 
-const initialState: InitialStateProps = {
-  // we initialize what our initialState is here
+const initialState: InitialStateProps = { // we initialize what our initialState is here
   port: null,
   currentTab: null,
   currentTitle: 'No Target',
@@ -26,10 +25,8 @@ function App(): JSX.Element {
   return (
     <ThemeProvider theme={theme}>
       <Router>
-        {' '}
         {/* we wrap our application with the <Router> tag so that all components that are nested will have the react-router context */}
         <StoreContext.Provider value={useReducer(mainReducer, initialState)}>
-          {' '}
           {/* we wrap our MainContainer with the provider so that we will be able to use the store context. We create our store by using useReducer and passing it into the value property */}
           <MainContainer />
         </StoreContext.Provider>

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

@@ -195,11 +195,7 @@ const PerformanceVisx = (props: PerformanceVisxProps): JSX.Element => {
   }, [dispatch]);
 
   const renderComparisonBargraph = () => {
-    console.log('hierarchy', hierarchy);
-    console.log('series', series);
-    console.log('hierarchy && series !== false', hierarchy && series !== false);
     if (hierarchy && series !== false) {
-      console.log('barGraphComparison triggered');
       return (
         <BarGraphComparison
           comparison={allStorage()}
@@ -212,7 +208,6 @@ const PerformanceVisx = (props: PerformanceVisxProps): JSX.Element => {
         />
       );
     }
-    console.log('barGraphComparisonActions triggered');
     return (
       <BarGraphComparisonActions
         comparison={allStorage()}

src/app/containers/ActionContainer.tsx

@@ -58,8 +58,7 @@ function ActionContainer(props): JSX.Element {
       obj.stateSnapshot.children[0].state && // with a 'state'
       obj.stateSnapshot.children[0].name // and a 'name'
     ) {
-      const newObj: Record<string, unknown> = {
-        // we create a new Record object (whose property keys are Keys and whose property values are Type. This utility can be used to map the properties of a type to another type) and populate it's properties with relevant values from our argument 'obj'.
+      const newObj: Record<string, unknown> = { // we create a new Record object (whose property keys are Keys and whose property values are Type. This utility can be used to map the properties of a type to another type) and populate it's properties with relevant values from our argument 'obj'.
         index: obj.index,
         displayName: `${obj.name}.${obj.branch}`,
         state: obj.stateSnapshot.children[0].state,
@@ -73,8 +72,7 @@ function ActionContainer(props): JSX.Element {
       hierarchyArr.push(newObj); // we push our record object into 'hiearchyArr' defined on line 35
     }
 
-    if (obj.children) {
-      // if argument has a 'children' array, we iterate through it and run 'displayArray' on each element
+    if (obj.children) { // if argument has a 'children' array, we iterate through it and run 'displayArray' on each element
       obj.children.forEach((element): void => {
         displayArray(element);
       });
@@ -98,8 +96,7 @@ function ActionContainer(props): JSX.Element {
       currIndex++;
       if (currIndex > hierarchyArr.length - 1) return;
       dispatch(changeView(currIndex));
-    } else if (e.key === 'Enter') {
-      // enter key pressed
+    } else if (e.key === 'Enter') { // enter key pressed
       e.stopPropagation(); // prevents further propagation of the current event in the capturing and bubbling phases
       e.preventDefault(); // needed or will trigger onClick right after
       dispatch(changeSlider(currIndex));
@@ -108,8 +105,6 @@ function ActionContainer(props): JSX.Element {
 
   // Sort hierarchyArr by index property of each object. This will be useful when later when we build our components so that our components will be displayed in index/chronological order
   hierarchyArr.sort((a: Obj, b: Obj): number => a.index - b.index);
-  // Sort hierarchyArr by index property of each object. This will be useful later when we render the components: components will be displayed in index/chronological order
-  hierarchyArr.sort((a:Obj, b:Obj):number => a.index - b.index);
 
   // we create a map of components that are constructed from "hierarchyArr's" elements/snapshots
   actionsArr = hierarchyArr.map(