currently converted 3 files to TypeScript. Need to test on a different computer to verify it is working

spincycle01 · spincycle01 · commit 00d7d2b7032d · 2019-05-03T11:52:52.000-04:00
diff --git a/src/utils/componentRender.util.js b/src/utils/componentRender.util.js
@@ -1,18 +1,22 @@
 const componentRender = (component, data) => {
   const {
-    stateful,
-    id,
-    position,
-    childrenArray,
-    title,
-    props,
+    stateful, id, position, childrenArray, title, props,
   } = component;
 
+  // need to filter with reduce the import, copy from below
   if (stateful) {
     return `
       import React, { Component } from 'react';
-      import PropTypes from 'prop-types';
-      ${childrenArray.map(child => `import ${child.componentName} from './${child.componentName}.tsx'`).join('\n')}
+      ${childrenArray
+    .map(child => `import ${child.componentName} from './${child.componentName}.tsx'`)
+    .reduce((acc, child) => {
+      if (!acc.includes(child)) {
+        acc.push(child);
+        return acc;
+      }
+      return acc;
+    }, [])
+    .join('\n')}
       
       class ${title} extends Component {
       constructor(props) {
@@ -29,33 +33,34 @@ const componentRender = (component, data) => {
         }
       }
 
-      ${title}.propTypes = {
-        ${props.map(p => `${p.key}: PropTypes.${p.type}${p.required ? '.isRequired' : ''},`).join('\n')}
-      }
-
       export default ${title};
     `;
   }
 
   return `
     import React from 'react';
-    import PropTypes from 'prop-types';
-    ${childrenArray.map(child => `import ${child.componentName} from './${child.componentName}.tsx'`).join('\n')}
+    ${childrenArray
+    .map(child => `import ${child.componentName} from './${child.componentName}.tsx'`)
+    .reduce((acc, child) => {
+      if (!acc.includes(child)) {
+        acc.push(child);
+        return acc;
+      }
+      return acc;
+    }, [])
+    .join('\n')}
     
 
     type Props = {
-      
+      ${component.props.map(prop => `${prop.key}: ${prop.type}`).join('\n')}
     }
-    const ${title} = props => (
+
+    const ${title} = (props: Props) => (
       <div>
         ${childrenArray.map(child => `<${child.componentName}/>`).join('\n')}
       </div>
     );
 
-    ${title}.propTypes = {
-      ${props.map(p => `${p.key}: PropTypes.${p.type}${p.required ? '.isRequired' : ''},`).join('\n')}
-    }
-
     export default ${title};
   `;
 };
diff --git a/src/utils/createApplication.util.js b/src/utils/createApplication.util.js
@@ -10,46 +10,49 @@
 import fs from 'fs';
 import { format } from 'prettier';
 
-function createApplicationUtil({path, appName, genOption, repoUrl}) {
+function createIndexHtml() {
+  const fileName = 'index.html';
+  const data = `
+  <!DOCTYPE html>
+  <html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Document</title>
+  </head>
+  <body>
+    <div id='root'></div>
+    <script src='bundle.js'></script>
+  </body>
+  </html>
+  `;
+  fs.writeFile(fileName, format(data, {
+    singleQuote: true,
+    trailingComma: 'es5',
+    bracketSpacing: true,
+    jsxBracketSameLine: true,
+    parser: 'babel',
+  }),
+  (err) => {
+    if (err) {
+      console.log('index.html error:', err.message);
+    } else {
+      console.log('index.html written successfully');
+    }
+  });
+}
+
+async function createApplicationUtil({path, appName, genOption, repoUrl}) {
   if (genOption === 1) {
-    return [
-      function createIndexHtml() {
-        const fileName = 'index.html';
-        const data = `
-          <!DOCTYPE html>
-          <html lang="en">
-          <head>
-            <meta charset="UTF-8">
-            <meta name="viewport" content="width=device-width, initial-scale=1.0">
-            <meta http-equiv="X-UA-Compatible" content="ie=edge">
-            <title>Document</title>
-          </head>
-          <body>
-            <div id='root'></div>
-            <script src='bundle.js'></script>
-          </body>
-          </html>
-        `;
-        fs.writeFile(fileName, format(data, {
-          singleQuote: true,
-          trailingComma: 'es5',
-          bracketSpacing: true,
-          jsxBracketSameLine: true,
-          parser: 'babel',
-        }),
-        (err) => {
-          if (err) {
-            console.log('index.html error:', err.message);
-          } else {
-            console.log('index.html written successfully');
-          }
-        });
-      },
-    ];
+    await createIndexHtml();
   }
 }
 export default createApplicationUtil;
 
+
+
+
 // async function createApplicationUtil({
 //   path, appName, genOption, repoUrl,
 // }) {
