cleaned up code, removing console.logs and comments

co-authored-by: Chris Tang [email protected]

Author: crlim

app/src/components/bottom/UseStateModal.tsx

@@ -3,7 +3,7 @@ import Modal from '@material-ui/core/Modal';
 import StateContext from '../../context/context';
 import TableStateProps from '../right/TableStateProps';
 
-// TODO: typescript interface or type check
+
 function UseStateModal({ updateAttributeWithState, attributeToChange, childId }) {
   const [state, dispatch] = useContext(StateContext);
   const [open, setOpen] = useState(false);
@@ -25,8 +25,7 @@ function UseStateModal({ updateAttributeWithState, attributeToChange, childId })
       </button>)
   }
 
-  // return the selected state's ID back so the value of it can be updated in the customizationpanel.  to the assign the value of selected state to attribute tied to useState button (currently just text)
-  // attribute to change as parameter for
+  // table to choose state from
   const body = (
     <div className="useState-position">
       <div className="useState-header">
@@ -52,15 +51,15 @@ function UseStateModal({ updateAttributeWithState, attributeToChange, childId })
             displayObject = {displayObject}
             selectHandler={(table) => {
               if (statePropsId < 0) setStatePropsId(table.row.id);
-              // if object => show object table
+              // if object or array => show sub table
               if (table.row.type === "object") {
                 setStateKey(stateKey + table.row.key + '.');
                 setDisplayObject(table.row.value);
               } else if (table.row.type === "array") {
                 setStateKey(stateKey + table.row.key)
                 setDisplayObject(table.row.value);
               } else {
-                // if not object => actually update state
+                // if not object or array => update state
                 setDisplayObject(null);
                 updateAttributeWithState(attributeToChange, componentProviderId, statePropsId, table.row, stateKey + table.row.key);
                 setStateKey('')

app/src/components/right/TableStateProps.tsx

@@ -46,9 +46,6 @@ const getColumns = (props) => {
       renderCell: function renderCell(params:any) {
         const getIdRow = () => {
           const { api } = params;
-          console.log('Line 49 params =', params);
-          console.log('Line 50 id = ', params.id);
-          // const fields = api.getAllColumns().map((c: any) => c.field).filter((c : any) => c !== '__check__' && !!c);
           return params.id;
 
           // return params.getValue(fields[0]);
@@ -66,7 +63,6 @@ const getColumns = (props) => {
   ];
 };
 
-//, providerId=1
 const TableStateProps = (props) => {
   const classes = useStyles();
   const [state] = useContext(StateContext);
@@ -100,7 +96,6 @@ const TableStateProps = (props) => {
       rows = providerComponent.stateProps.slice();
     }
   }
-  console.log(rows);
 
   const { selectHandler } : StatePropsPanelProps = props;
 

app/src/containers/CustomizationPanel.tsx

@@ -208,13 +208,6 @@ const CustomizationPanel = ({ isThemeLight }): JSX.Element => {
 
   // function to pass into UseStateModal to use state to update attribute
   const updateAttributeWithState = (attributeName, componentProviderId, statePropsId, statePropsRow, stateKey='') => {
-
-    // get the stateProps of the componentProvider
-    // const currentComponent = state.components[componentProviderId - 1];
-    // const currentComponentProps = currentComponent.stateProps;
-    // const newInput = currentComponentProps[statePropsRow.id - 1].value;
-
-    console.log('stateKey', stateKey);
     const newInput = statePropsRow.value;
 
     if (attributeName === 'compText') {

app/src/interfaces/Interfaces.ts

@@ -25,7 +25,7 @@ export interface ChildElement {
   attributes?: object;
   children?: ChildElement[];
   annotations?: string;
-  stateUsed?: object; // {compText: 'key1.key2.a', compLink: 'key3.b'}
+  stateUsed?: object; 
 }
 export interface Component {
   id: number;