removed the column menu as mostly redudant as there is a sorting arrow

Author: dentonwong

app/src/components/StateManagement/CreateTab/components/TableParentProps.tsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import {
   DataGrid,
-  GridEditRowsModel,
+  GridEditRowsModel
 } from '@mui/x-data-grid';
 import Button from '@mui/material/Button';
 import makeStyles from '@mui/styles/makeStyles';
@@ -104,6 +104,7 @@ const TableParentProps = props => {
   }
   }
 
+
   return (
     <div className={'state-prop-grid'}> 
       <DataGrid
@@ -113,6 +114,7 @@ const TableParentProps = props => {
         rowsPerPageOptions={[5]}
         editRowsModel={editRowsModel}
         className={props.isThemeLight ? classes.themeLight : classes.themeDark}
+        disableColumnMenu={true}
       />
     </div>
   );

app/src/components/StateManagement/CreateTab/components/TablePassedInProps.tsx

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import {
   DataGrid,
-  GridEditRowsModel,
+  GridEditRowsModel
 } from '@mui/x-data-grid';
 import Button from '@mui/material/Button';
 import ClearIcon from '@mui/icons-material/Clear';
@@ -96,6 +96,7 @@ const TablePassedInProps = props => {
   let rows: any = passedInProps?.slice();
   //let rows: readonly StateProp[] = passedInProps?.slice() || [];
 
+
   return (
     <div className={'state-prop-grid'}>
       <DataGrid
@@ -105,6 +106,7 @@ const TablePassedInProps = props => {
         rowsPerPageOptions={[5]}
         editRowsModel={editRowsModel}
         className={props.isThemeLight ? classes.themeLight : classes.themeDark}
+        disableColumnMenu={true}
       />
     </div>
   );

app/src/components/StateManagement/CreateTab/components/TableStateProps.tsx

@@ -103,8 +103,6 @@ const TableStateProps = props => {
   let rows = [];
   currentComponent.stateProps?.forEach((prop) =>{ rows.push(prop)}); 
 
-
-
   return (
     <div className={'state-prop-grid'}>
       <DataGrid
@@ -115,7 +113,7 @@ const TableStateProps = props => {
         editRowsModel={editRowsModel}
         onRowClick={selectHandler}
         className={props.isThemeLight ? classes.themeLight : classes.themeDark}
-        disableColumnMenu={false}
+        disableColumnMenu={true}
       />
     </div>
   );

app/src/components/bottom/BottomPanel.tsx

@@ -25,10 +25,7 @@ const BottomPanel = (props): JSX.Element => {
     const newVal = h + dy;
     const styles = window.getComputedStyle(node.current);
     const min = parseInt(styles.minHeight, 10);
-    console.log('is newVal > min newVal', newVal)
-    console.log('is newVal > min min', min)
     node.current.style.height = newVal > min ? `${h + dy}px` : `${min}px`;
-    console.log('mousemove', node.current.style.height)
   };
 
   const mouseUpHandler = function () {

app/src/components/bottom/BottomTabs.tsx

@@ -50,7 +50,7 @@ const BottomTabs = (props): JSX.Element => {
     <div
       className={`${classes.root} ${classes.rootLight}`}
       style={{ backgroundColor: '#191919' , zIndex: 1, borderTop: '2px solid grey'}}
-      onMouseOver={()=>{console.log('mouse over'); props.setBottomShow(true)}}
+      onMouseOver={()=>{props.setBottomShow(true)}}
     >
       <Box
         display="flex"

app/src/containers/MainContainer.tsx

@@ -71,9 +71,7 @@ const MainContainer = (props): JSX.Element => {
     const bottomPanelRef = useRef(null);
 
     useEffect(() => {
-      const handleClick = (event) => {
-        console.log(event.target)
-        
+      const handleClick = (event) => {        
         if (event.type === "click" &&
           (bottomPanelRef.current &&
           !bottomPanelRef.current.contains(event.target) && event.target.getAttribute("role") != "menu" && !event.target.classList.contains('MuiInput-input')) || (event.type === "message" && event.data === 'iframeClicked')) {