Revert "Children added to parent components will have their children props destructured to parents automatically"

Author: jzuniga206

main.js

@@ -55,6 +55,7 @@ function redo() {
   mainWindow.webContents.send('redo');
 }
 
+
 function toggleTutorial() {
   mainWindow.webContents.send('tutorial_clicked');
 }
@@ -121,17 +122,16 @@ const createWindow = () => {
     {
       label: 'Edit',
       submenu: [
-        {
+        { 
           label: 'Undo',
-          accelerator: process.platform === 'darwin' ? 'Cmd+Z' : 'Ctrl+Z', //these hotkeys are a tad bit glitchy
+          accelerator: process.platform === 'darwin' ? 'Cmd+Z' : 'Ctrl+Z',  //these hotkeys are a tad bit glitchy
           click() {
             undo();
           }
         },
-        {
+        { 
           label: 'Redo',
-          accelerator:
-            process.platform === 'darwin' ? 'Cmd+Shift+Z' : 'Ctrl+Shift+Z',
+          accelerator: process.platform === 'darwin' ? 'Cmd+Shift+Z' : 'Ctrl+Shift+Z',
           click() {
             redo();
           }
@@ -142,8 +142,8 @@ const createWindow = () => {
         { role: 'paste' },
         { role: 'pasteandmatchstyle' },
         { role: 'delete' },
-        { role: 'selectall' }
-      ]
+        { role: 'selectall' },
+      ],
     },
     {
       label: 'View',
@@ -172,9 +172,9 @@ const createWindow = () => {
           }
         },
         {
-          label: 'Tutorial',
-          click() {
-            toggleTutorial();
+            label: 'Tutorial',
+            click() {
+              toggleTutorial();
           }
         }
       ]
@@ -269,7 +269,7 @@ app.on('ready', () => {
   }
   globalShortcut.register('Escape', () => {
     escape();
-  });
+  })
 });
 
 // Quit when all windows are closed.

src/actions/actionCreators.ts

@@ -61,9 +61,9 @@ export const addComponent = ({ title }: { title: string }) => (
   dispatch({ type: ADD_COMPONENT, payload: { title } });
 };
 
-export const addProp = ({ key, type }: { key: string; type: string }) => ({
+export const addProp = (prop: PropInt) => ({
   type: ADD_PROP,
-  payload: { key, type }
+  payload: { ...prop }
 });
 
 export const changeTutorial = (tutorial: number) => ({

src/components/AddChildProps.tsx

@@ -44,7 +44,7 @@ class BottomPanel extends Component<BottomPanelPropsInt> {
     } = this.props;
 
     return (
-      <div className='bottom-panel' style={{ width: '100%' }}>
+      <div className="bottom-panel" style={{ width: '100%' }}>
         <BottomTabs
           components={components}
           focusComponent={focusComponent}

src/components/CodePreview.tsx

@@ -142,7 +142,6 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
       focusComponent,
       deleteProp,
       addProp,
-      changeFocusComponent,
       focusChild,
       updateCode,
       toggleCodeEdit,
@@ -166,12 +165,12 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
           <Tab
             disableRipple
             classes={{ root: classes.tabRoot, selected: classes.tabSelected }}
-            label='Application Tree'
+            label="Application Tree"
           />
           <Tab
             disableRipple
             classes={{ root: classes.tabRoot, selected: classes.tabSelected }}
-            label='Code Preview'
+            label="Code Preview"
           />
           <Tab
             disableRipple
@@ -188,13 +187,13 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
           <Tab
             disableRipple
             classes={{ root: classes.tabRoot, selected: classes.tabSelected }}
-            label='Add Child Props'
+            label="Add Child Props"
           />
         </Tabs>
 
         {value === 0 && (
           <div
-            id='treeWrapper'
+            id="treeWrapper"
             style={{
               width: '100%',
               height: '100%'
@@ -231,9 +230,9 @@ class BottomTabs extends Component<BottomTabsPropsInt, StateInt> {
         {value === 1 && (
           <CodePreview
             focusComponent={focusComponent}
-            components={components}
-            changeFocusComponent={changeFocusComponent}
             updateCode={updateCode}
+            components={components}
+            changeFocusComponent={this.props.changeFocusComponent}
             toggleCodeEdit={toggleCodeEdit}
             codeReadOnly={codeReadOnly}
           />