Fixed errors that prevented app from rendering

Author: tsully

app/src/components/bottom/CodePreview.tsx

@@ -1,6 +1,6 @@
 import React, { useContext } from 'react';
 import { stateContext } from '../../context/context';
-import { format } from 'prettier';
+// import { format } from 'prettier';
 import AceEditor from 'react-ace';
 import { makeStyles } from '@material-ui/core/styles';
 import 'ace-builds/src-noconflict/mode-javascript';

app/src/containers/AppContainer.tsx

@@ -6,7 +6,7 @@ import RightContainer from './RightContainer';
 import theme from '../theme';
 
 // ** Used with electron to render
-const IPC = require('electron').ipcRenderer;
+// const IPC = require('electron').ipcRenderer;
 
 class AppContainer extends Component {
   constructor(props) {

app/src/containers/LeftContainer.tsx

@@ -17,7 +17,7 @@ import createModal from '../components/left/createModal';
 import { stateContext } from '../context/context';
 import exportProject from '../utils/exportProject.util';
 
-const IPC = require('electron').ipcRenderer;
+// const IPC = require('electron').ipcRenderer;
 
 const useStyles = makeStyles({
   btnGroup: {

app/src/helperFunctions/generateCode.ts

@@ -1,9 +1,7 @@
-import { format } from 'prettier';
+// import { format } from 'prettier';
 import { Component, State, ChildElement } from '../interfaces/InterfacesNew';
 import HTMLTypes from '../context/HTMLTypes';
 
-
-
 // generate code based on the component heirarchy
 const generateUnformattedCode = (comps: Component[], componentId: number) => {
   const components = [...comps];
@@ -45,25 +43,39 @@ const generateUnformattedCode = (comps: Component[], componentId: number) => {
           if (child.tag === 'img') {
             return `<${child.tag} src=""${formatStyles(child.style)} />`;
           } else if (child.tag === 'a') {
-            return `<${child.tag} href=""${formatStyles(child.style)}>[LINK]</${child.tag}>`;
+            return `<${child.tag} href=""${formatStyles(child.style)}>[LINK]</${
+              child.tag
+            }>`;
           } else if (child.tag === 'div') {
             return `<${child.tag}${formatStyles(
               child.style
             )}>${writeNestedElements(child.children)}</${child.tag}>`;
           } else if (child.tag === 'h1') {
-            return `<${child.tag}${formatStyles(child.style)}>HEADER 1</${child.tag}>`;
+            return `<${child.tag}${formatStyles(child.style)}>HEADER 1</${
+              child.tag
+            }>`;
           } else if (child.tag === 'h2') {
-            return `<${child.tag}${formatStyles(child.style)}>HEADER 2</${child.tag}>`;
+            return `<${child.tag}${formatStyles(child.style)}>HEADER 2</${
+              child.tag
+            }>`;
           } else if (child.tag === 'form') {
-            return `<${child.tag}${formatStyles(child.style)}>FORM</${child.tag}>`;
+            return `<${child.tag}${formatStyles(child.style)}>FORM</${
+              child.tag
+            }>`;
           } else if (child.tag === 'p') {
-            return `<${child.tag}${formatStyles(child.style)}>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</${child.tag}>`;
+            return `<${child.tag}${formatStyles(
+              child.style
+            )}>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</${
+              child.tag
+            }>`;
           } else if (child.tag === 'li') {
             return `<ul${formatStyles(child.style)}><li>item 1</li>
             <li>item 2</li>
             <li>item 3</li></ul>`;
-          } else if (child.tag === 'button'){
-            return `<${child.tag}${formatStyles(child.style)}>BUTTON</${child.tag}>`;
+          } else if (child.tag === 'button') {
+            return `<${child.tag}${formatStyles(child.style)}>BUTTON</${
+              child.tag
+            }>`;
           } else {
             return `<${child.tag}${formatStyles(child.style)}></${child.tag}>`;
           }
@@ -135,13 +147,14 @@ const generateUnformattedCode = (comps: Component[], componentId: number) => {
 
 // formats code with prettier linter
 const formatCode = (code: string) => {
-  return format(code, {
-    singleQuote: true,
-    trailingComma: 'es5',
-    bracketSpacing: true,
-    jsxBracketSameLine: true,
-    parser: 'babel'
-  });
+  return code;
+  // return format(code, {
+  //   singleQuote: true,
+  //   trailingComma: 'es5',
+  //   bracketSpacing: true,
+  //   jsxBracketSameLine: true,
+  //   parser: 'babel'
+  // });
 };
 
 // generate code based on component heirarchy and then return the rendered code
@@ -151,4 +164,3 @@ const generateCode = (components: Component[], componentId: number) => {
 };
 
 export default generateCode;
-

app/src/public/index.ejs

@@ -18,14 +18,14 @@
     /> -->
     <!-- Removed this option from original CSP () -->
     <title>ReacType</title>
-    <!-- <link
+    <link
       rel="stylesheet"
       href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"
     />
     <link
       rel="stylesheet"
       href="https://fonts.googleapis.com/icon?family=Material+Icons"
-    /> -->
+    />
   </head>
 
   <body>