From b1e67bcd4d7ac3ba10c02573f91ea6567b0840fd Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Tue, 14 Sep 2021 20:06:25 -0700
Subject: [PATCH 01/22] created checkbox, still needs logic implementation.
 Philip, Daniel, William, Miles

---
 app/src/components/right/ExportButton.tsx |  9 +++++++++
 app/src/utils/createGatsbyApp.util.ts     | 10 +++++++++-
 app/src/utils/createTestSuite.util.ts     |  9 +++++++++
 app/src/utils/exportProject.util.ts       |  4 +++-
 package.json                              |  6 +++---
 5 files changed, 33 insertions(+), 5 deletions(-)
 create mode 100644 app/src/utils/createTestSuite.util.ts

diff --git a/app/src/components/right/ExportButton.tsx b/app/src/components/right/ExportButton.tsx
index 8c08ed54e..09f92467a 100644
--- a/app/src/components/right/ExportButton.tsx
+++ b/app/src/components/right/ExportButton.tsx
@@ -60,15 +60,22 @@ export default function ExportButton() {
             <ListItemText primary={option} style={{ textAlign: 'center' }} />
           </ListItem>
         ))}
+        <ListItem>
+          <input type="checkbox" id="tests" name="tests"></input>
+          <label for="tests">Include Tests</label>
+        </ListItem>
       </List>
     );
 
+    let testchecked = 0;
     // helper function called by showGenerateAppModal
     // this function will prompt the user to choose an app directory once they've chosen their export option
     const chooseGenOptions = (genOpt: number) => {
       // set export option: 0 --> export only components, 1 --> export full project
+
       genOption = genOpt;
       window.api.chooseAppDir();
+      testchecked = document.getElementById('tests').checked;
       closeModal();
     };
 
@@ -80,12 +87,14 @@ export default function ExportButton() {
     // when a directory is chosen, the callback will export the project to the chosen folder
     // Note: this listener is imported from the main process via preload.js
     window.api.addAppDirChosenListener(path => {
+      // console.log(testchecked);
       exportProject(
         path,
         state.name
           ? state.name
           : 'New_ReacType_Project_' + Math.ceil(Math.random() * 99).toString(),
         genOption,
+        testchecked,
         state.projectType,
         state.components,
         state.rootComponents
diff --git a/app/src/utils/createGatsbyApp.util.ts b/app/src/utils/createGatsbyApp.util.ts
index 32d54df28..506e32e9a 100644
--- a/app/src/utils/createGatsbyApp.util.ts
+++ b/app/src/utils/createGatsbyApp.util.ts
@@ -1,6 +1,7 @@
 // Create all files necessary to run a gatsby.js application
 
 import createGatsbyFiles from './createGatsbyFiles.util';
+import createTestFiles from './createTestSuite.util';
 import { Component } from '../interfaces/Interfaces';
 
 const camelToKebab= (camel:string) => {
@@ -140,14 +141,17 @@ async function createGatsbyAppUtil({
   path,
   appName,
   components,
-  rootComponents
+  rootComponents,
+  testchecked,
 }: {
   path: string;
   appName: string;
   components: Component[];
   rootComponents: number[];
+  testchecked: boolean;
 }) {
   console.log('in the createGatsbyApplication util');
+  console.log('testchecked: ',testchecked);
 
   await initFolders(path, appName);
   await createBaseTsx(path, appName);
@@ -156,5 +160,9 @@ async function createGatsbyAppUtil({
   await createTsConfig(path, appName);
   await createGatsbyFiles(components, path, appName, rootComponents);
 
+  if (testchecked) {
+    console.log('testchecked: ',testchecked);
+    await createTestFiles()
+  }
 }
 export default createGatsbyAppUtil;
diff --git a/app/src/utils/createTestSuite.util.ts b/app/src/utils/createTestSuite.util.ts
new file mode 100644
index 000000000..01f82b915
--- /dev/null
+++ b/app/src/utils/createTestSuite.util.ts
@@ -0,0 +1,9 @@
+
+// create config files
+// add webpack dependencies
+// create tests for components
+const createTestSuite = () => {
+  console.log('creating test suites');
+}
+
+export default createTestSuite;
\ No newline at end of file
diff --git a/app/src/utils/exportProject.util.ts b/app/src/utils/exportProject.util.ts
index 5f65afe2d..3f4f52024 100644
--- a/app/src/utils/exportProject.util.ts
+++ b/app/src/utils/exportProject.util.ts
@@ -8,6 +8,7 @@ const exportProject = (
   path: string,
   appName: string,
   genOption: number,
+  tests: boolean,
   projectType: string,
   components: any,
   rootComponents: number[]
@@ -26,9 +27,10 @@ const exportProject = (
       console.log(err)
     );
   } else if (genOption === 1 && projectType === 'Gatsby.js') {
-    createGatsbyApp({ path, appName, components, rootComponents }).catch(err =>
+    createGatsbyApp({ path, appName, components, rootComponents, tests }).catch(err =>
       console.log(err));
   }
+
 };
 
 export default exportProject;
diff --git a/package.json b/package.json
index 7a9ae9eb6..449fa41f1 100644
--- a/package.json
+++ b/package.json
@@ -47,8 +47,8 @@
     "dev-server": "cross-env NODE_ENV=development webpack-dev-server --config ./webpack.development.js",
     "dev": "concurrently --success first \"cross-env NODE_ENV=development webpack-dev-server --config ./webpack.development.js\" \"cross-env NODE_ENV=development electron .\" \"npm run server\" -k",
     "p": "concurrently --success first \"npm run dev-server\" \"cross-env NODE_ENV=production electron .\" \"nodemon server/server.js\" -k",
-    "prod-build": "cross-env NODE_ENV=production npx webpack --mode=production --config ./webpack.production.js", 
-    "prod": "npm run prod-build && electron . --no-sandbox", 
+    "prod-build": "cross-env NODE_ENV=production npx webpack --mode=production --config ./webpack.production.js",
+    "prod": "npm run prod-build && electron . --no-sandbox",
     "pack": "electron-builder --dir",
     "dist": "npm run prod-build && electron-builder",
     "dist-mac": "npm run prod-build && electron-builder --mac",
@@ -63,7 +63,7 @@
     "url": "git+https://github.com/open-source-labs/ReacType.git"
   },
   "keywords": [
-    "electron", 
+    "electron",
     "prototying",
     "react",
     "next.js"

From c0cc38b8d41d3afc65abcf4ddbc7519710388920 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Wed, 15 Sep 2021 12:23:50 -0700
Subject: [PATCH 02/22] beta: tests config for gatsby app export in progress,
 Philip Miles

---
 app/src/utils/createGatsbyApp.util.ts | 86 +++++++++++++++++++--------
 app/src/utils/exportProject.util.ts   |  2 +-
 2 files changed, 61 insertions(+), 27 deletions(-)

diff --git a/app/src/utils/createGatsbyApp.util.ts b/app/src/utils/createGatsbyApp.util.ts
index 506e32e9a..e52548817 100644
--- a/app/src/utils/createGatsbyApp.util.ts
+++ b/app/src/utils/createGatsbyApp.util.ts
@@ -25,30 +25,64 @@ const compToCSS = (component: Component) => {
 }
 
 //createPackage
-export const createPackage = (path, appName) => {
+export const createPackage = (path, appName, test) => {
+  // console.log('in createpackage: ',test);
   const filePath = `${path}/${appName}/package.json`;
-  const data = `
-{
-  "name": "reactype-gatsby",
-  "version": "1.0.0",
-  "description": "",
-  "scripts": {
-    "dev": "gatsby develop",
-    "build": "gatsby build",
-    "start": "npm run dev"
-  },
-  "dependencies": {
-    "gatsby": "^2.26.1",
-    "react": "16.13.1",
-    "react-dom": "16.13.1"
-  },
-  "devDependencies": {
-    "@types/node": "^14.0.20",
-    "@types/react": "^16.9.41",
-    "typescript": "^3.9.6"
+  let data = ``;
+  if (!test) {
+    data = `
+      {
+        "name": "reactype-gatsby",
+        "version": "1.0.0",
+        "description": "",
+        "scripts": {
+          "dev": "gatsby develop",
+          "build": "gatsby build",
+          "start": "npm run dev"
+        },
+        "dependencies": {
+          "gatsby": "^2.26.1",
+          "react": "16.13.1",
+          "react-dom": "16.13.1"
+        },
+        "devDependencies": {
+          "@types/node": "^14.0.20",
+          "@types/react": "^16.9.41",
+          "typescript": "^3.9.6"
+        }
+      }
+        `;
+  } else {
+    data = `
+      {
+        "name": "reactype-gatsby",
+        "version": "1.0.0",
+        "description": "",
+        "scripts": {
+          "dev": "gatsby develop",
+          "build": "gatsby build",
+          "start": "npm run dev"
+        },
+        "dependencies": {
+          "gatsby": "^2.26.1",
+          "react": "16.13.1",
+          "react-dom": "16.13.1"
+        },
+        "devDependencies": {
+          "@types/node": "^14.0.20",
+          "@types/react": "^16.9.41",
+          "typescript": "^3.9.6",
+          "@types/enzyme": "^3.10.9",
+          "@types/jest": "^27.0.1",
+          "babel-jest": "^27.2.0",
+          "enzyme": "^3.11.0",
+          "enzyme-adapter-react-16": "^1.15.6",
+          "jest": "^27.2.0",
+          "react-test-renderer": "^17.0.2"
+        }
+      }
+        `;
   }
-}
-  `;
   window.api.writeFile(filePath, data, err => {
     if (err) {
       console.log('package.json error:', err.message);
@@ -152,17 +186,17 @@ async function createGatsbyAppUtil({
 }) {
   console.log('in the createGatsbyApplication util');
   console.log('testchecked: ',testchecked);
-
+  
   await initFolders(path, appName);
   await createBaseTsx(path, appName);
   await createDefaultCSS(path, appName, components);
-  await createPackage(path, appName);
+  await createPackage(path, appName, testchecked);
   await createTsConfig(path, appName);
-  await createGatsbyFiles(components, path, appName, rootComponents);
-
   if (testchecked) {
     console.log('testchecked: ',testchecked);
     await createTestFiles()
   }
+  await createGatsbyFiles(components, path, appName, rootComponents);
+  
 }
 export default createGatsbyAppUtil;
diff --git a/app/src/utils/exportProject.util.ts b/app/src/utils/exportProject.util.ts
index 3f4f52024..e5b90b527 100644
--- a/app/src/utils/exportProject.util.ts
+++ b/app/src/utils/exportProject.util.ts
@@ -27,7 +27,7 @@ const exportProject = (
       console.log(err)
     );
   } else if (genOption === 1 && projectType === 'Gatsby.js') {
-    createGatsbyApp({ path, appName, components, rootComponents, tests }).catch(err =>
+    createGatsbyApp({ path, appName, components, rootComponents, testchecked: tests }).catch(err =>
       console.log(err));
   }
 

From c0660f24672a8ce93161b3e595c4d0c73023d788 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Wed, 15 Sep 2021 17:30:36 -0700
Subject: [PATCH 03/22] finished configuring package.json in
 createGatsbyApp.util.ts, Philip, Miles

---
 app/src/utils/createGatsbyApp.util.ts | 57 ++++++++++-----------------
 1 file changed, 21 insertions(+), 36 deletions(-)

diff --git a/app/src/utils/createGatsbyApp.util.ts b/app/src/utils/createGatsbyApp.util.ts
index e52548817..a5ecd8c63 100644
--- a/app/src/utils/createGatsbyApp.util.ts
+++ b/app/src/utils/createGatsbyApp.util.ts
@@ -28,32 +28,23 @@ const compToCSS = (component: Component) => {
 export const createPackage = (path, appName, test) => {
   // console.log('in createpackage: ',test);
   const filePath = `${path}/${appName}/package.json`;
-  let data = ``;
-  if (!test) {
-    data = `
-      {
-        "name": "reactype-gatsby",
-        "version": "1.0.0",
-        "description": "",
-        "scripts": {
-          "dev": "gatsby develop",
-          "build": "gatsby build",
-          "start": "npm run dev"
-        },
-        "dependencies": {
-          "gatsby": "^2.26.1",
-          "react": "16.13.1",
-          "react-dom": "16.13.1"
-        },
-        "devDependencies": {
-          "@types/node": "^14.0.20",
-          "@types/react": "^16.9.41",
-          "typescript": "^3.9.6"
-        }
-      }
-        `;
-  } else {
-    data = `
+  
+  let tsjest = `,
+          "@types/enzyme": "^3.10.9",
+          "@types/jest": "^27.0.1",
+          "babel-jest": "^27.2.0",
+          "enzyme": "^3.11.0",
+          "enzyme-adapter-react-16": "^1.15.6",
+          "jest": "^27.2.0",
+          "react-test-renderer": "^17.0.2",
+          "@types/react-dom": "^17.0.9",
+          "@types/enzyme-adapter-react-16": "^1.0.6",
+          "@types/react-test-renderer": "^17.0.1",
+          "babel-preset-gatsby": "^1.13.0",
+          "identity-obj-proxy": "^3.0.0",
+          "ts-jest": "^27.0.5"`;
+ 
+  const data = `
       {
         "name": "reactype-gatsby",
         "version": "1.0.0",
@@ -61,7 +52,8 @@ export const createPackage = (path, appName, test) => {
         "scripts": {
           "dev": "gatsby develop",
           "build": "gatsby build",
-          "start": "npm run dev"
+          "start": "npm run dev"${
+            test ? '"test": "jest"': '' }
         },
         "dependencies": {
           "gatsby": "^2.26.1",
@@ -71,18 +63,11 @@ export const createPackage = (path, appName, test) => {
         "devDependencies": {
           "@types/node": "^14.0.20",
           "@types/react": "^16.9.41",
-          "typescript": "^3.9.6",
-          "@types/enzyme": "^3.10.9",
-          "@types/jest": "^27.0.1",
-          "babel-jest": "^27.2.0",
-          "enzyme": "^3.11.0",
-          "enzyme-adapter-react-16": "^1.15.6",
-          "jest": "^27.2.0",
-          "react-test-renderer": "^17.0.2"
+          "typescript": "^3.9.6"${
+            test ? tsjest : '' }
         }
       }
         `;
-  }
   window.api.writeFile(filePath, data, err => {
     if (err) {
       console.log('package.json error:', err.message);

From 8726be28dde7c4757f7dbce57856913055c0b27a Mon Sep 17 00:00:00 2001
From: dreille <66196129+dreille@users.noreply.github.com>
Date: Wed, 15 Sep 2021 17:30:41 -0700
Subject: [PATCH 04/22] Co-authored-by: wbrittwage
 <wbrittwage@users.noreply.github.com>

---
 app/electron/main.js                    | 296 ++++++++++++------------
 app/src/components/login/SignIn.tsx     |  23 +-
 app/src/helperFunctions/gitHubOauth.ts  |   2 +-
 package.json                            |   7 +-
 server/controllers/sessionController.js | 182 ++++++++-------
 server/controllers/userController.js    |  57 +++--
 server/server.js                        |  40 ++--
 7 files changed, 313 insertions(+), 294 deletions(-)

diff --git a/app/electron/main.js b/app/electron/main.js
index c6efa1eba..983092fe8 100644
--- a/app/electron/main.js
+++ b/app/electron/main.js
@@ -360,153 +360,153 @@ if (isDev) {
 }
 
 // // for github oauth login in production, since cookies are not accessible through document.cookie on local filesystem, we need electron to grab the cookie that is set from oauth, this listens for an set cookie event from the renderer process then sends back the cookie
-// ipcMain.on('set_cookie', event => {
-//   session.defaultSession.cookies
-//     .get({ url: serverUrl })
-//     .then(cookie => {
-//       // this if statement is necessary or the setInterval on main app will constantly run and will emit this event.reply, causing a memory leak
-//       // checking for a cookie inside array will only emit reply when a cookie exists
-//       if (cookie[0]) {
-//         //console.log(cookie);
-//         event.reply('give_cookie', cookie);
-//       }
-//     })
-//     .catch(error => {
-//       console.log('Error giving cookies in set_cookie:', error);
-//     });
-// });
-
-// // again for production, document.cookie is not accessible so we need this listener on main to delete the cookie on logout
-// ipcMain.on('delete_cookie', event => {
-//   session.defaultSession.cookies
-//     .remove(serverUrl, 'ssid')
-//     // .then(removed => {
-//     //   console.log('Cookies deleted', removed);
-//     // })
-//     .catch(err => console.log('Error deleting cookie:', err));
-// });
-
-// // opens new window for github oauth when button on sign in page is clicked
-// ipcMain.on('github', event => {
-//   // your  applications credentials
-//   const githubUrl = 'https://github.com/login/oauth/authorize?';
-//   const options = {
-//     client_id: process.env.GITHUB_ID,
-//     client_secret: process.env.GITHUB_SECRET,
-//     scopes: ['user:email', 'notifications']
-//   };
-//   // create new browser window object with size, title, security options
-//   const github = new BrowserWindow({
-//     width: 800,
-//     height: 600,
-//     title: 'Github Oauth',
-//     webPreferences: {
-//       nodeIntegration: false,
-//       nodeIntegrationInWorker: false,
-//       nodeIntegrationInSubFrames: false,
-//       contextIsolation: true,
-//       enableRemoteModule: false,
-//       zoomFactor: 1.0
-//     }
-//   });
-//   const authUrl = `${githubUrl}client_id=${process.env.GITHUB_ID}`;
-//   github.loadURL(authUrl);
-//   github.show();
-//   const handleCallback = url => {
-//     const raw_code = /code=([^&]\*)/.exec(url) || null;
-//     const code = raw_code && raw_code.length > 1 ? raw_code[1] : null;
-//     const error = /\?error=(.+)\$/.exec(url);
-
-//     if (code || error) {
-//       // Close the browser if code found or error
-//       authWindow.destroy();
-//     }
-
-//     // If there is a code, proceed to get token from github
-//     if (code) {
-//       self.requestGithubToken(options, code);
-//     } else if (error) {
-//       alert(
-//         "Oops! Something went wrong and we couldn't" +
-//           'log you in using Github. Please try again.'
-//       );
-//     }
-//   };
-
-//   github.webContents.on('will-navigate', (e, url) => handleCallback(url));
-
-//   github.webContents.on('did-finish-load', (e, url, a, b) => {
-//     github.webContents.selectAll();
-//   });
-
-//   github.webContents.on('did-get-redirect-request', (e, oldUrl, newUrl) =>
-//     handleCallback(newUrl)
-//   );
-
-//   // Reset the authWindow on close
-//   github.on('close', () => (authWindow = null), false);
-
-//   // if final callback is reached and we get a redirect from server back to our app, close oauth window
-//   github.webContents.on('will-redirect', (e, callbackUrl) => {
-//     const matches = callbackUrl.match(/(?<=\?=).*/);
-//     const ssid = matches ? matches[0] : '';
-//     callbackUrl = callbackUrl.replace(/\?=.*/, '');
-//     let redirectUrl = 'app://rse/';
-//     if (isDev) {
-//       redirectUrl = 'http://localhost:8080/';
-//     }
-//     if (callbackUrl === redirectUrl) {
-//       dialog.showMessageBox({
-//         type: 'info',
-//         title: 'ReacType',
-//         icon: resolve('app/src/public/icons/png/256x256.png'),
-//         message: 'Github Oauth Successful!'
-//       });
-//       github.close();
-//       win.webContents
-//         .executeJavaScript(`window.localStorage.setItem('ssid', '${ssid}')`)
-//         .then(result => win.loadURL(selfHost))
-//         .catch(err => console.log(err));
-//     }
-//   });
-// });
-
-// ipcMain.on('tutorial', event => {
-//   // create new browser window object with size, title, security options
-//   const tutorial = new BrowserWindow({
-//     width: 800,
-//     height: 600,
-//     minWidth: 661,
-//     title: 'Tutorial',
-//     webPreferences: {
-//       nodeIntegration: false,
-//       nodeIntegrationInWorker: false,
-//       nodeIntegrationInSubFrames: false,
-//       contextIsolation: true,
-//       enableRemoteModule: false,
-//       zoomFactor: 1.0
-//     }
-//   });
-//   // redirects to relevant server endpoint
-//   //github.loadURL(`${serverUrl}/github`);
-//   // show window
-//   tutorial.show();
-//   // if final callback is reached and we get a redirect from server back to our app, close oauth window
-//   // github.webContents.on('will-redirect', (e, callbackUrl) => {
-//   //   let redirectUrl = 'app://rse/';
-//   //   if (isDev) {
-//   //     redirectUrl = 'http://localhost:8080/';
-//   //   }
-//   //   if (callbackUrl === redirectUrl) {
-//   //     dialog.showMessageBox({
-//   //       type: 'info',
-//   //       title: 'ReacType',
-//   //       icon: resolve('app/src/public/icons/png/256x256.png'),
-//   //       message: 'Github Oauth Successful!'
-//   //     });
-//   //     github.close();
-//   //   }
-//   // });
-// });
+ipcMain.on('set_cookie', event => {
+  session.defaultSession.cookies
+    .get({ url: serverUrl })
+    .then(cookie => {
+      // this if statement is necessary or the setInterval on main app will constantly run and will emit this event.reply, causing a memory leak
+      // checking for a cookie inside array will only emit reply when a cookie exists
+      if (cookie[0]) {
+        //console.log(cookie);
+        event.reply('give_cookie', cookie);
+      }
+    })
+    .catch(error => {
+      console.log('Error giving cookies in set_cookie:', error);
+    });
+});
+
+// again for production, document.cookie is not accessible so we need this listener on main to delete the cookie on logout
+ipcMain.on('delete_cookie', event => {
+  session.defaultSession.cookies
+    .remove(serverUrl, 'ssid')
+    // .then(removed => {
+    //   console.log('Cookies deleted', removed);
+    // })
+    .catch(err => console.log('Error deleting cookie:', err));
+});
+
+// opens new window for github oauth when button on sign in page is clicked
+ipcMain.on('github', event => {
+  // your  applications credentials
+  const githubUrl = 'https://github.com/login/oauth/authorize?';
+  const options = {
+    client_id: process.env.GITHUB_ID,
+    client_secret: process.env.GITHUB_SECRET,
+    scopes: ['user:email', 'notifications']
+  };
+  // create new browser window object with size, title, security options
+  const github = new BrowserWindow({
+    width: 800,
+    height: 600,
+    title: 'Github Oauth',
+    webPreferences: {
+      nodeIntegration: false,
+      nodeIntegrationInWorker: false,
+      nodeIntegrationInSubFrames: false,
+      contextIsolation: true,
+      enableRemoteModule: false,
+      zoomFactor: 1.0
+    }
+  });
+  const authUrl = `${githubUrl}client_id=${process.env.GITHUB_ID}`;
+  github.loadURL(authUrl);
+  github.show();
+  const handleCallback = url => {
+    const raw_code = /code=([^&]\*)/.exec(url) || null;
+    const code = raw_code && raw_code.length > 1 ? raw_code[1] : null;
+    const error = /\?error=(.+)\$/.exec(url);
+
+    if (code || error) {
+      // Close the browser if code found or error
+      authWindow.destroy();
+    }
+
+    // If there is a code, proceed to get token from github
+    if (code) {
+      self.requestGithubToken(options, code);
+    } else if (error) {
+      alert(
+        "Oops! Something went wrong and we couldn't" +
+          'log you in using Github. Please try again.'
+      );
+    }
+  };
+
+  github.webContents.on('will-navigate', (e, url) => handleCallback(url));
+
+  github.webContents.on('did-finish-load', (e, url, a, b) => {
+    github.webContents.selectAll();
+  });
+
+  github.webContents.on('did-get-redirect-request', (e, oldUrl, newUrl) =>
+    handleCallback(newUrl)
+  );
+
+  // Reset the authWindow on close
+  github.on('close', () => (authWindow = null), false);
+
+  // if final callback is reached and we get a redirect from server back to our app, close oauth window
+  github.webContents.on('will-redirect', (e, callbackUrl) => {
+    const matches = callbackUrl.match(/(?<=\?=).*/);
+    const ssid = matches ? matches[0] : '';
+    callbackUrl = callbackUrl.replace(/\?=.*/, '');
+    let redirectUrl = 'app://rse/';
+    if (isDev) {
+      redirectUrl = 'http://localhost:8080/';
+    }
+    if (callbackUrl === redirectUrl) {
+      dialog.showMessageBox({
+        type: 'info',
+        title: 'ReacType',
+        icon: resolve('app/src/public/icons/png/256x256.png'),
+        message: 'Github Oauth Successful!'
+      });
+      github.close();
+      win.webContents
+        .executeJavaScript(`window.localStorage.setItem('ssid', '${ssid}')`)
+        .then(result => win.loadURL(selfHost))
+        .catch(err => console.log(err));
+    }
+  });
+});
+
+ipcMain.on('tutorial', event => {
+  // create new browser window object with size, title, security options
+  const tutorial = new BrowserWindow({
+    width: 800,
+    height: 600,
+    minWidth: 661,
+    title: 'Tutorial',
+    webPreferences: {
+      nodeIntegration: false,
+      nodeIntegrationInWorker: false,
+      nodeIntegrationInSubFrames: false,
+      contextIsolation: true,
+      enableRemoteModule: false,
+      zoomFactor: 1.0
+    }
+  });
+  // redirects to relevant server endpoint
+  github.loadURL(`${serverUrl}/github`);
+  // show window
+  tutorial.show();
+  // if final callback is reached and we get a redirect from server back to our app, close oauth window
+  github.webContents.on('will-redirect', (e, callbackUrl) => {
+    let redirectUrl = 'app://rse/';
+    if (isDev) {
+      redirectUrl = 'http://localhost:8080/';
+    }
+    if (callbackUrl === redirectUrl) {
+      dialog.showMessageBox({
+        type: 'info',
+        title: 'ReacType',
+        icon: resolve('app/src/public/icons/png/256x256.png'),
+        message: 'Github Oauth Successful!'
+      });
+      github.close();
+    }
+  });
+});
 
 module.exports = dialog;
diff --git a/app/src/components/login/SignIn.tsx b/app/src/components/login/SignIn.tsx
index 39f94e4ad..fae7d9561 100644
--- a/app/src/components/login/SignIn.tsx
+++ b/app/src/components/login/SignIn.tsx
@@ -73,7 +73,7 @@ const SignIn: React.FC<LoginInt & RouteComponentProps> = props => {
   
  
   // Commented because window api is broken. Work in progress
-  /* useEffect(() => {
+  useEffect(() => {
     const githubCookie = setInterval(() => {
       window.api.setCookie();
       window.api.getCookie(cookie => {
@@ -88,7 +88,7 @@ const SignIn: React.FC<LoginInt & RouteComponentProps> = props => {
         }
       });
     }, 2000);
-  }, []);*/
+  }, []);
 
   const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     let inputVal = e.target.value;
@@ -158,7 +158,15 @@ const SignIn: React.FC<LoginInt & RouteComponentProps> = props => {
     window.localStorage.setItem('ssid', 'guest');
     props.history.push('/');
   };
+  
+  const handleGithubLogin = (
+    e: React.MouseEvent<HTMLButtonElement, MouseEvent>
+    ) => {
+      e.preventDefault();
+        window.api.github();
+        props.history.push('/');
 
+    }
   const responseFacebook = response => {
     if (response.accessToken) {
       newUserIsCreated(response.email, response.email, randomPassword()).then(
@@ -235,7 +243,16 @@ const SignIn: React.FC<LoginInt & RouteComponentProps> = props => {
         >
           Sign In
         </Button>
-        
+        <Button
+          fullWidth
+          id="SignInWithGithub"
+          variant="contained"
+          color="default"
+          className={classes.submit}
+          onClick={e => handleGithubLogin(e)}
+        >
+          Sign In With Github
+        </Button>
         <Button
           fullWidth
           variant="contained"
diff --git a/app/src/helperFunctions/gitHubOauth.ts b/app/src/helperFunctions/gitHubOauth.ts
index be972ee88..9d6d44655 100644
--- a/app/src/helperFunctions/gitHubOauth.ts
+++ b/app/src/helperFunctions/gitHubOauth.ts
@@ -2,7 +2,7 @@ const handleGitHubOauth = () => {
   console.log('git hub');
   const gitHubUrl = 'https://github.com/login/oauth/authorize?';
   const authUrl =
-  `${gitHubUrl}client_id=${process.env.GITHUB_ID}`;
+  `${gitHubUrl}client_id=`;
   window.open(authUrl);
 }
 
diff --git a/package.json b/package.json
index 7a9ae9eb6..e91b63c0c 100644
--- a/package.json
+++ b/package.json
@@ -47,8 +47,8 @@
     "dev-server": "cross-env NODE_ENV=development webpack-dev-server --config ./webpack.development.js",
     "dev": "concurrently --success first \"cross-env NODE_ENV=development webpack-dev-server --config ./webpack.development.js\" \"cross-env NODE_ENV=development electron .\" \"npm run server\" -k",
     "p": "concurrently --success first \"npm run dev-server\" \"cross-env NODE_ENV=production electron .\" \"nodemon server/server.js\" -k",
-    "prod-build": "cross-env NODE_ENV=production npx webpack --mode=production --config ./webpack.production.js", 
-    "prod": "npm run prod-build && electron . --no-sandbox", 
+    "prod-build": "cross-env NODE_ENV=production npx webpack --mode=production --config ./webpack.production.js",
+    "prod": "npm run prod-build && electron . --no-sandbox",
     "pack": "electron-builder --dir",
     "dist": "npm run prod-build && electron-builder",
     "dist-mac": "npm run prod-build && electron-builder --mac",
@@ -63,7 +63,7 @@
     "url": "git+https://github.com/open-source-labs/ReacType.git"
   },
   "keywords": [
-    "electron", 
+    "electron",
     "prototying",
     "react",
     "next.js"
@@ -134,6 +134,7 @@
     "dotenv": "^8.2.0",
     "electron-debug": "^3.1.0",
     "electron-devtools-installer": "^2.2.4",
+    "electron-oauth2": "^3.0.0",
     "electron-splashscreen": "^1.0.0",
     "electron-window-manager": "^1.0.6",
     "enzyme": "^3.4.1",
diff --git a/server/controllers/sessionController.js b/server/controllers/sessionController.js
index 49de717f1..3dc7e4b07 100644
--- a/server/controllers/sessionController.js
+++ b/server/controllers/sessionController.js
@@ -66,97 +66,99 @@ sessionController.startSession = (req, res, next) => {
   });
 };
 
-// sessionController.gitHubResponse = (req, res, next) => {
-//   // console.log(req)
-//   const { code } = req.query;
-//   // console.log('code =>', code);
-//   if (!code)
-//     return next({
-//       log: 'Undefined or no code received from github.com',
-//       message: 'Undefined or no code received from github.com',
-//       status: 400
-//     });
-//   fetch(`https://github.com/login/oauth/access_token`, {
-//     method: 'POST',
-//     headers: {
-//       Accept: 'application/json',
-//       'Content-Type': 'application/json'
-//     },
-//     body: JSON.stringify({
-//       client_id: process.env.GITHUB_ID,
-//       client_secret: process.env.GITHUB_SECRET,
-//       code
-//     })
-//   })
-//     .then(res => res.json())
-//     .then(token => {
-//       res.locals.token = token['access_token'];
-//       return next();
-//     })
-//     .catch(err =>
-//       res.status(500).json({ message: `${err.message} in gitHubResponse` })
-//     );
-// };
+sessionController.gitHubResponse = (req, res, next) => {
+  console.log('hi')
+  console.log(req)
+  const { code } = req.query;
+  console.log('code =>', code);
+  if (!code)
+    return next({
+      log: 'Undefined or no code received from github.com',
+      message: 'Undefined or no code received from github.com',
+      status: 400
+    });
+  fetch(`https://github.com/login/oauth/access_token`, {
+    method: 'POST',
+    headers: {
+      Accept: 'application/json',
+      'Content-Type': 'application/json'
+    },
+    body: JSON.stringify({
+      client_id: process.env.GITHUB_ID,
+      client_secret: process.env.GITHUB_SECRET,
+      code
+    })
+  })
+    .then(res => res.json())
+    .then(token => {
+      res.locals.token = token['access_token'];
+      return next();
+    })
+    .catch(err =>
+      res.status(500).json({ message: `${err.message} in gitHubResponse` })
+    );
+};
 
-// sessionController.gitHubSendToken = (req, res, next) => {
-//   const { token } = res.locals;
-//   fetch(`https://api.github.com/user/emails`, {
-//     method: 'GET',
-//     headers: {
-//       Accept: 'application/vnd.github.v3+json',
-//       Authorization: `token ${token}`
-//     }
-//   })
-//     .then(res => res.json())
-//     .then(data => {
-//       res.locals.githubEmail = data[0]['email'];
-//       res.locals.signUpType = 'oauth';
-//       return next();
-//     })
-//     .catch(err => {
-//       if (err.message === `Cannot read property 'email' of undefined`) {
-//         return res
-//           .status(400)
-//           .json({ message: `${err.message} in gitHubSendToken` });
-//       } else {
-//         return res
-//           .status(500)
-//           .json({ message: `${err.message} in gitHubSendToken` });
-//       }
-//     });
-// };
+sessionController.gitHubSendToken = (req, res, next) => {
+  const { token } = res.locals;
+  fetch(`https://api.github.com/user/emails`, {
+    method: 'GET',
+    headers: {
+      Accept: 'application/vnd.github.v3+json',
+      Authorization: `token ${token}`
+    }
+  })
+    .then(res => res.json())
+    .then(data => {
+      console.log('this is data:', data);
+      res.locals.githubEmail = data[0]['email'];
+      res.locals.signUpType = 'oauth';
+      return next();
+    })
+    .catch(err => {
+      if (err.message === `Cannot read property 'email' of undefined`) {
+        return res
+          .status(400)
+          .json({ message: `${err.message} in gitHubSendToken` });
+      } else {
+        return res
+          .status(500)
+          .json({ message: `${err.message} in gitHubSendToken` });
+      }
+    });
+};
 
-// // creates a session when logging in with github
-// sessionController.githubSession = (req, res, next) => {
-//   // req.user is passed in from passport js -> serializeuser/deserializeuser
-//   const cookieId = req.user._id;
-//   Sessions.findOne({ cookieId }, (err, session) => {
-//     if (err) {
-//       return next({
-//         log: `Error in sessionController.githubSession find session: ${err}`,
-//         message: {
-//           err: `Error in sessionController.githubSession find session, check server logs for details`
-//         }
-//       });
-//     } else if (!session) {
-//       Sessions.create({ cookieId }, (err, session) => {
-//         if (err) {
-//           return next({
-//             log: `Error in sessionController.githubSession create session: ${err}`,
-//             message: {
-//               err: `Error in sessionController.githubSession create session, check server logs for details`
-//             }
-//           });
-//         } else {
-//           res.locals.id = session.cookieId;
-//           return next();
-//         }
-//       });
-//     } else {
-//       res.locals.id = session.cookieId;
-//       return next();
-//     }
-//   });
-// };
+// creates a session when logging in with github
+sessionController.githubSession = (req, res, next) => {
+  // req.user is passed in from passport js -> serializeuser/deserializeuser
+  const cookieId = req.user._id;
+  Sessions.findOne({ cookieId }, (err, session) => {
+    if (err) {
+      return next({
+        log: `Error in sessionController.githubSession find session: ${err}`,
+        message: {
+          err: `Error in sessionController.githubSession find session, check server logs for details`
+        }
+      });
+    } else if (!session) {
+      Sessions.create({ cookieId }, (err, session) => {
+        if (err) {
+          return next({
+            log: `Error in sessionController.githubSession create session: ${err}`,
+            message: {
+              err: `Error in sessionController.githubSession create session, check server logs for details`
+            }
+          });
+        } else {
+          res.locals.id = session.cookieId;
+          return next();
+        }
+      });
+    } else {
+      res.locals.id = session.cookieId;
+      return next();
+    }
+  });
+};
 
 module.exports = sessionController;
diff --git a/server/controllers/userController.js b/server/controllers/userController.js
index fbc8d4dfa..930e0b031 100644
--- a/server/controllers/userController.js
+++ b/server/controllers/userController.js
@@ -5,36 +5,35 @@ const userController = {};
 const bcrypt = require('bcryptjs');
 
 // random password is subtituted when user uses Oauth and no new password is provided
-// const randomPassword = () => {
-//   function getRandomSpecialChar() {
-//     const code = Math.round(Math.random() * (38 - 37) + 37);
-//     return String.fromCharCode(code);
-//   }
-//   function getRandomDigit() {
-//     const code = Math.round(Math.random() * (57 - 48) + 48);
-//     return String.fromCharCode(code);
-//   }
-//   function getRandomLetter() {
-//     const code = Math.round(Math.random() * (90 - 65) + 65);
-//     return String.fromCharCode(code);
-//   }
-//   let password = '';
-//   for (let i = 0; i < 6; i += 1) {
-//     password += getRandomLetter() + getRandomDigit() + getRandomSpecialChar();
-//   }
-//   return password;
-// }
+const randomPassword = () => {
+  function getRandomSpecialChar() {
+    const code = Math.round(Math.random() * (38 - 37) + 37);
+    return String.fromCharCode(code);
+  }
+  function getRandomDigit() {
+    const code = Math.round(Math.random() * (57 - 48) + 48);
+    return String.fromCharCode(code);
+  }
+  function getRandomLetter() {
+    const code = Math.round(Math.random() * (90 - 65) + 65);
+    return String.fromCharCode(code);
+  }
+  let password = '';
+  for (let i = 0; i < 6; i += 1) {
+    password += getRandomLetter() + getRandomDigit() + getRandomSpecialChar();
+  }
+  return password;
+}
 
 userController.createUser = (req, res, next) => {
   const { email, username, password } = req.body;
 
   // use this condition for Oauth login
-  // if (res.locals.signUpType === 'oauth') {
-  //   email = res.locals.githubEmail;
-  //   username = email;
-  //   password = randomPassword();
-  // }
-  // error handling if username or email or password is missing
+  if (res.locals.signUpType === 'oauth') {
+    email = res.locals.githubEmail;
+    username = email;
+    password = randomPassword();
+  }
 
   if (!username) {
     return res.status(400).json('No username input');
@@ -83,10 +82,10 @@ userController.createUser = (req, res, next) => {
 userController.verifyUser = (req, res, next) => {
   let { username, password, isFbOauth } = req.body;
   // handle Oauth
-  // if (res.locals.signUpType === 'oauth') {
-  //   username = res.locals.githubEmail;
-  //   password = res.locals.githubPassword;
-  // }
+  if (res.locals.signUpType === 'oauth') {
+    username = res.locals.githubEmail;
+    password = res.locals.githubPassword;
+  }
   if (!username) {
     return res.status(400).json('No Username Input');
   }
diff --git a/server/server.js b/server/server.js
index 73401e35e..736fd0069 100644
--- a/server/server.js
+++ b/server/server.js
@@ -38,26 +38,26 @@ app.use(
 // subsequent logins seem to be working fine, however
 
 // initializes passport and passport sessions
-// app.use(passport.initialize());
-// app.use(passport.session());
-
-// // for Oauth which is currently not working
-// app.get(
-//   '/github/callback',
-//   sessionController.gitHubResponse,
-//   sessionController.gitHubSendToken,
-//   userController.createUser,
-//   userController.verifyUser,
-//   cookieController.setSSIDCookie,
-//   sessionController.startSession,
-//   (req, res) => {
-//     if (isDev) {
-//       return res.status(200).redirect(`http://localhost:8080?=${res.locals.ssid}`);
-//     } else {
-//       return res.status(200).redirect('app://rse');
-//     }
-//   }
-// );
+app.use(passport.initialize());
+app.use(passport.session());
+
+// for Oauth which is currently not working
+app.get(
+  '/github/callback',
+  sessionController.gitHubResponse,
+  sessionController.gitHubSendToken,
+  userController.createUser,
+  userController.verifyUser,
+  cookieController.setSSIDCookie,
+  sessionController.startSession,
+  (req, res) => {
+    if (isDev) {
+      return res.status(200).redirect(`http://localhost:8080?=${res.locals.ssid}`);
+    } else {
+      return res.status(200).redirect('app://rse');
+    }
+  }
+);
 
 
 /*

From 4eb592b5bebe66f149c169ab5e9e20d274a28787 Mon Sep 17 00:00:00 2001
From: dreille <66196129+dreille@users.noreply.github.com>
Date: Wed, 15 Sep 2021 19:57:00 -0700
Subject: [PATCH 05/22] Co-authored-by: Philip Hua <philiphuahhhh@gmail.com>
 Co-authored-by: Miles818 <Miles818@users.noreply.github.com> Co-authored-by:
 wbrittwage <wbrittwage@users.noreply.github.com>

---
 server/controllers/sessionController.js | 47 ++++++++++++++-----------
 server/models/reactypeModels.js         |  2 +-
 server/server.js                        |  1 +
 3 files changed, 29 insertions(+), 21 deletions(-)

diff --git a/server/controllers/sessionController.js b/server/controllers/sessionController.js
index 3dc7e4b07..530e040b3 100644
--- a/server/controllers/sessionController.js
+++ b/server/controllers/sessionController.js
@@ -68,35 +68,42 @@ sessionController.startSession = (req, res, next) => {
 
 sessionController.gitHubResponse = (req, res, next) => {
   console.log('hi')
-  console.log(req)
   const { code } = req.query;
+  console.log('code:',code)
   console.log('code =>', code);
+  console.log('JSON:', )
+  console.log(process.env.GITHUB_ID)
   if (!code)
     return next({
       log: 'Undefined or no code received from github.com',
       message: 'Undefined or no code received from github.com',
       status: 400
     });
-  fetch(`https://github.com/login/oauth/access_token`, {
-    method: 'POST',
-    headers: {
-      Accept: 'application/json',
-      'Content-Type': 'application/json'
-    },
-    body: JSON.stringify({
-      client_id: process.env.GITHUB_ID,
-      client_secret: process.env.GITHUB_SECRET,
-      code
+    console.log('heyyyy');
+    fetch(`https://github.com/login/oauth/access_token?client_id=${process.env.GITHUB_ID}&client_secret=${process.env.GITHUB_SECRET}&code=${code}`, {
+      method: 'POST',
+      headers: {
+        accept: 'application/json',
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify({
+        client_id: process.env.GITHUB_ID,
+        client_secret: process.env.GITHUB_SECRET,
+        code
+      })
     })
-  })
-    .then(res => res.json())
-    .then(token => {
-      res.locals.token = token['access_token'];
-      return next();
-    })
-    .catch(err =>
-      res.status(500).json({ message: `${err.message} in gitHubResponse` })
-    );
+      .then(res => res.json())
+      .then(token => {
+        console.log('hi');
+        console.log('token: ',token['access_token'] )
+        res.locals.token = token['access_token'];
+        return next();
+      })
+      .catch(err => {
+        console.log('hi');
+        res.status(500).json({ message: `${err.message} in gitHubResponse` })
+      }
+      );
 };
 
 sessionController.gitHubSendToken = (req, res, next) => {
diff --git a/server/models/reactypeModels.js b/server/models/reactypeModels.js
index 68f10fce2..fe2970ef5 100644
--- a/server/models/reactypeModels.js
+++ b/server/models/reactypeModels.js
@@ -10,7 +10,7 @@
  */
 const mongoose = require('mongoose');
 const bcrypt = require('bcryptjs');
-const URI = process.env.NODE_ENV === 'production' ? process.env.URI : require('../../config').URI;
+const URI = process.env.NODE_ENV === 'production' ? process.env.URI : process.env.URI;
 
 const SALT_WORK_FACTOR = 14;
 // connect to mongo db
diff --git a/server/server.js b/server/server.js
index 736fd0069..e1a9f897b 100644
--- a/server/server.js
+++ b/server/server.js
@@ -1,6 +1,7 @@
 const { ApolloServer } = require('apollo-server-express');
 const express = require('express');
 const cookieParser = require('cookie-parser');
+const passport = require('passport');
 
 const path = require('path');
 const cors = require('cors');

From b20492e9b7c1823311b0312f7b512f08ac8cd1b0 Mon Sep 17 00:00:00 2001
From: dreille <66196129+dreille@users.noreply.github.com>
Date: Thu, 16 Sep 2021 10:44:41 -0700
Subject: [PATCH 06/22] Co-authored-by: Philip Hua <philiphuahhhh@gmail.com>
 Co-authored-by: Miles818 <Miles818@users.noreply.github.com> Co-authored-by:
 wbrittwage <wbrittwage@users.noreply.github.com>

---
 server/controllers/sessionController.js | 4 +++-
 server/controllers/userController.js    | 6 +++++-
 server/models/reactypeModels.js         | 3 ++-
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/server/controllers/sessionController.js b/server/controllers/sessionController.js
index 530e040b3..ce2c48131 100644
--- a/server/controllers/sessionController.js
+++ b/server/controllers/sessionController.js
@@ -1,3 +1,5 @@
+const fetch = require ('node-fetch');
+
 require('dotenv').config();
 const { Sessions } = require('../models/reactypeModels');
 
@@ -108,7 +110,7 @@ sessionController.gitHubResponse = (req, res, next) => {
 
 sessionController.gitHubSendToken = (req, res, next) => {
   const { token } = res.locals;
-  fetch(`https://api.github.com/user/emails`, {
+  fetch(`https://api.github.com/user/public_emails`, {
     method: 'GET',
     headers: {
       Accept: 'application/vnd.github.v3+json',
diff --git a/server/controllers/userController.js b/server/controllers/userController.js
index 930e0b031..8b15ed644 100644
--- a/server/controllers/userController.js
+++ b/server/controllers/userController.js
@@ -26,13 +26,16 @@ const randomPassword = () => {
 }
 
 userController.createUser = (req, res, next) => {
-  const { email, username, password } = req.body;
 
+  let email, username, password;
   // use this condition for Oauth login
   if (res.locals.signUpType === 'oauth') {
     email = res.locals.githubEmail;
     username = email;
     password = randomPassword();
+    res.locals.githubPassword = password;
+  } else {
+    ({ email, username, password } = req.body);
   }
 
   if (!username) {
@@ -82,6 +85,7 @@ userController.createUser = (req, res, next) => {
 userController.verifyUser = (req, res, next) => {
   let { username, password, isFbOauth } = req.body;
   // handle Oauth
+  console.log('We verifying');
   if (res.locals.signUpType === 'oauth') {
     username = res.locals.githubEmail;
     password = res.locals.githubPassword;
diff --git a/server/models/reactypeModels.js b/server/models/reactypeModels.js
index fe2970ef5..dbbe81ddd 100644
--- a/server/models/reactypeModels.js
+++ b/server/models/reactypeModels.js
@@ -10,7 +10,8 @@
  */
 const mongoose = require('mongoose');
 const bcrypt = require('bcryptjs');
-const URI = process.env.NODE_ENV === 'production' ? process.env.URI : process.env.URI;
+const URI = process.env.NODE_ENV === 'production' ? process.env.URI : 'mongodb+srv://Daniel:codesmith@cluster0.mm1df.mongodb.net/Cluster0?retryWrites=true&w=majority';
+// const mongoURI = ('mongodb+srv://Daniel:codesmith@cluster0.mm1df.mongodb.net/Cluster0?retryWrites=true&w=majority');
 
 const SALT_WORK_FACTOR = 14;
 // connect to mongo db

From bac3b5092f5ba6a6dfd800e4292c44363bbaa7d5 Mon Sep 17 00:00:00 2001
From: dreille <66196129+dreille@users.noreply.github.com>
Date: Thu, 16 Sep 2021 19:48:25 -0700
Subject: [PATCH 07/22] Oauth functioning

---
 app/electron/main.js                    | 3 ++-
 app/src/components/login/SignIn.tsx     | 1 -
 server/controllers/sessionController.js | 1 +
 server/models/reactypeModels.js         | 4 ++--
 server/package.json                     | 7 ++-----
 server/server.js                        | 2 +-
 6 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/app/electron/main.js b/app/electron/main.js
index 983092fe8..bfd975d8c 100644
--- a/app/electron/main.js
+++ b/app/electron/main.js
@@ -256,6 +256,7 @@ app.on('web-contents-created', (event, contents) => {
       'https://www.facebook.com',
       'https://www.smashingmagazine.com',
       'https://www.html5rocks.com',
+      'app://rse/'
     ];
 
     // Log and prevent the app from redirecting to a new page
@@ -465,7 +466,7 @@ ipcMain.on('github', event => {
       github.close();
       win.webContents
         .executeJavaScript(`window.localStorage.setItem('ssid', '${ssid}')`)
-        .then(result => win.loadURL(selfHost))
+        .then(result => win.loadURL(`app://rse?=${ssid}`))
         .catch(err => console.log(err));
     }
   });
diff --git a/app/src/components/login/SignIn.tsx b/app/src/components/login/SignIn.tsx
index fae7d9561..dfe7cc72b 100644
--- a/app/src/components/login/SignIn.tsx
+++ b/app/src/components/login/SignIn.tsx
@@ -165,7 +165,6 @@ const SignIn: React.FC<LoginInt & RouteComponentProps> = props => {
       e.preventDefault();
         window.api.github();
         props.history.push('/');
-
     }
   const responseFacebook = response => {
     if (response.accessToken) {
diff --git a/server/controllers/sessionController.js b/server/controllers/sessionController.js
index ce2c48131..87f679e9b 100644
--- a/server/controllers/sessionController.js
+++ b/server/controllers/sessionController.js
@@ -106,6 +106,7 @@ sessionController.gitHubResponse = (req, res, next) => {
         res.status(500).json({ message: `${err.message} in gitHubResponse` })
       }
       );
+      
 };
 
 sessionController.gitHubSendToken = (req, res, next) => {
diff --git a/server/models/reactypeModels.js b/server/models/reactypeModels.js
index dbbe81ddd..b040ae431 100644
--- a/server/models/reactypeModels.js
+++ b/server/models/reactypeModels.js
@@ -10,8 +10,8 @@
  */
 const mongoose = require('mongoose');
 const bcrypt = require('bcryptjs');
-const URI = process.env.NODE_ENV === 'production' ? process.env.URI : 'mongodb+srv://Daniel:codesmith@cluster0.mm1df.mongodb.net/Cluster0?retryWrites=true&w=majority';
-// const mongoURI = ('mongodb+srv://Daniel:codesmith@cluster0.mm1df.mongodb.net/Cluster0?retryWrites=true&w=majority');
+const mongoURI = 'mongodb+srv://Daniel:codesmith@cluster0.mm1df.mongodb.net/Cluster0?retryWrites=true&w=majority';
+const URI = process.env.NODE_ENV === 'production' ? mongoURI : 'mongodb+srv://Daniel:codesmith@cluster0.mm1df.mongodb.net/Cluster0?retryWrites=true&w=majority';
 
 const SALT_WORK_FACTOR = 14;
 // connect to mongo db
diff --git a/server/package.json b/server/package.json
index e575dd3b3..d34cf02f5 100644
--- a/server/package.json
+++ b/server/package.json
@@ -6,7 +6,6 @@
   "engines": {
     "node": "12.17.0"
   },
-
   "scripts": {
     "test": "jest --verbose ",
     "test:watch": "jest --watch",
@@ -14,13 +13,11 @@
     "prod": "cross-env NODE_ENV=production server.js",
     "dev": "cross-env NODE_ENV=development nodemon server.js"
   },
-
-
   "keywords": [],
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "apollo-server-express": "^2.24.0", 
+    "apollo-server-express": "^2.24.0",
     "bcryptjs": "^2.4.3",
     "body-parser": "^1.19.0",
     "cookie-parser": "^1.4.5",
@@ -28,7 +25,7 @@
     "cross-env": "^7.0.2",
     "dotenv": "^8.2.0",
     "express": "^4.17.1",
-    "graphql": "^15.5.0", 
+    "graphql": "^15.5.0",
     "mongoose": "^5.9.22",
     "nodemon": "^2.0.4",
     "passport": "^0.4.1",
diff --git a/server/server.js b/server/server.js
index e1a9f897b..d0d645895 100644
--- a/server/server.js
+++ b/server/server.js
@@ -55,7 +55,7 @@ app.get(
     if (isDev) {
       return res.status(200).redirect(`http://localhost:8080?=${res.locals.ssid}`);
     } else {
-      return res.status(200).redirect('app://rse');
+      return res.status(200).redirect(`app://rse?=${res.locals.ssid}`);
     }
   }
 );

From 065ad03c801800f5500429d0b9700ed598828108 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Fri, 17 Sep 2021 20:11:11 -0700
Subject: [PATCH 08/22] added config files genereation for gatsby app, Philip,
 Miles, Daniel, William

---
 app/src/utils/createGatsbyApp.util.ts |  9 +--
 app/src/utils/createTestSuite.util.ts | 90 ++++++++++++++++++++++++++-
 2 files changed, 93 insertions(+), 6 deletions(-)

diff --git a/app/src/utils/createGatsbyApp.util.ts b/app/src/utils/createGatsbyApp.util.ts
index a5ecd8c63..8c2a33569 100644
--- a/app/src/utils/createGatsbyApp.util.ts
+++ b/app/src/utils/createGatsbyApp.util.ts
@@ -1,7 +1,7 @@
 // Create all files necessary to run a gatsby.js application
 
 import createGatsbyFiles from './createGatsbyFiles.util';
-import createTestFiles from './createTestSuite.util';
+import createTestSuite from './createTestSuite.util';
 import { Component } from '../interfaces/Interfaces';
 
 const camelToKebab= (camel:string) => {
@@ -53,7 +53,8 @@ export const createPackage = (path, appName, test) => {
           "dev": "gatsby develop",
           "build": "gatsby build",
           "start": "npm run dev"${
-            test ? '"test": "jest"': '' }
+            test ? `,
+          "test": "jest"`: '' }
         },
         "dependencies": {
           "gatsby": "^2.26.1",
@@ -130,7 +131,7 @@ export const initFolders = (path:string, appName: string) => {
 };
 
 //createBaseTsx
-export const createBaseTsx = (path, appName) => {
+export const createBaseTsx = (path: string, appName: string) => {
 
   const filePath:string = `${path}/${appName}/src/pages/_app.tsx`;
   const data:string = `
@@ -179,7 +180,7 @@ async function createGatsbyAppUtil({
   await createTsConfig(path, appName);
   if (testchecked) {
     console.log('testchecked: ',testchecked);
-    await createTestFiles()
+    await createTestSuite({path, appName, components, rootComponents, testchecked});
   }
   await createGatsbyFiles(components, path, appName, rootComponents);
   
diff --git a/app/src/utils/createTestSuite.util.ts b/app/src/utils/createTestSuite.util.ts
index 01f82b915..86f326a27 100644
--- a/app/src/utils/createTestSuite.util.ts
+++ b/app/src/utils/createTestSuite.util.ts
@@ -2,8 +2,94 @@
 // create config files
 // add webpack dependencies
 // create tests for components
-const createTestSuite = () => {
-  console.log('creating test suites');
+// const createTestSuite = () => {
+//   console.log('creating test suites');
+// }
+
+const initFolders = (path: string, appName: string) => {
+  console.log(window); // remember to delete
+  let dir = path;
+  dir = `${dir}/${appName}`;
+  if (!window.api.existsSync(`${dir}/__mocks__`)) {
+    window.api.mkdirSync(`${dir}/__mocks__`);
+  }
+  if (!window.api.existsSync(`${dir}/__tests__`)) {
+    window.api.mkdirSync(`${dir}/__tests__`);
+  }
+}
+
+const createMocksFiles = (path: string, appName: string) => {
+  const filePath:string = `${path}/${appName}/__mocks__/file-mock.js`;
+  let data = `module.exports = "test-file-stub";`
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createMocksFiles error', err.message);
+    } else {
+      console.log('createTestSuite.util createMocksFiles written successfully');
+    }
+  });
+
+}
+
+
+
+const createTestsFiles = (path: string, appName: string) => {
+  const filePath:string = `${path}/${appName}/__mocks__/gatspy.js`;
+  let data: `
+  const React = require("react")
+  const gatsby = jest.requireActual("gatsby")
+
+  module.exports = {
+    ...gatsby,
+    Link: jest.fn().mockImplementation(
+      ({
+        activeClassName,
+        activeStyle,
+        getProps,
+        innerRef,
+        partiallyActive,
+        ref,
+        replace,
+        to,
+        ...rest
+      }) =>
+        React.createElement("a", {
+          ...rest,
+          href: to,
+        })
+    ),
+    StaticQuery: jest.fn(),
+    useStaticQuery: jest.fn(),
+  }
+`;
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createTestsFiles error', err.message);
+    } else {
+      console.log('createTestSuite.util createTestsFiles written successfully');
+    }
+  });
+}
+
+async function createTestSuite({
+  path,
+  appName,
+  components,
+  rootComponents,
+  testchecked,
+}: {
+  path: string;
+  appName: string;
+  components: Component[];
+  rootComponents: number[];
+  testchecked: boolean;
+}) {
+  console.log('in the createGatsbyApplication util');
+  console.log('testchecked: ', testchecked);
+
+  await initFolders(path, appName);
+  await createMocksFiles(path, appName);
+  await createTestsFiles(path, appName);
 }
 
 export default createTestSuite;
\ No newline at end of file

From b73aaf37a8641c64157f64dd0e781b35897d4f26 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Sat, 18 Sep 2021 10:48:00 -0700
Subject: [PATCH 09/22] finsihed setting up gatsby app connection files for
 export, Philip, https://github.com/pmhua, Daniel https://github.com/dreille,
 William https://github.com/wbrittwage, Miles https://github.com/Miles818

---
 app/src/utils/createTestSuite.util.ts | 66 ++++++++++++++++++++++++++-
 1 file changed, 65 insertions(+), 1 deletion(-)

diff --git a/app/src/utils/createTestSuite.util.ts b/app/src/utils/createTestSuite.util.ts
index 86f326a27..8a9298b10 100644
--- a/app/src/utils/createTestSuite.util.ts
+++ b/app/src/utils/createTestSuite.util.ts
@@ -35,7 +35,7 @@ const createMocksFiles = (path: string, appName: string) => {
 
 const createTestsFiles = (path: string, appName: string) => {
   const filePath:string = `${path}/${appName}/__mocks__/gatspy.js`;
-  let data: `
+  let data = `
   const React = require("react")
   const gatsby = jest.requireActual("gatsby")
 
@@ -71,6 +71,67 @@ const createTestsFiles = (path: string, appName: string) => {
   });
 }
 
+async function createJestConfigFile(path: String, appName: String){
+  const filePath:string = `${path}/${appName}/jest.config.js`;
+  const data:string = `
+  module.exports = {
+    transform: {
+      "^.+\\.tsx?$": "ts-jest",
+      "^.+\\.jsx?$": "<rootDir>/jest-preprocess.js",
+    },
+    testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.([tj]sx?)$",
+    moduleNameMapper: {
+      ".+\\.(css|styl|less|sass|scss)$": "identity-obj-proxy",
+      ".+\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/file-mock.js",
+    },
+    moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],
+    testPathIgnorePatterns: ["node_modules", ".cache"],
+    transformIgnorePatterns: ["node_modules/(?!(gatsby)/)"],
+    globals: {
+      __PATH_PREFIX__: '',
+    }
+  }
+  `
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createJestConfigFile error:', err.message);
+    } else {
+      console.log('createTestSuit.util createJestConfigFile written successfully');
+    }
+  });
+};
+
+async function createJestPreprocessFile(path: string, appName: string){
+  const filePath: string = `${path}/${appName}/jest-preprocess.js`;
+  const data:string = `
+  const babelOptions = {
+    presets: ["babel-preset-gatsby"],
+  }
+
+  module.exports = require("babel-jest").default.createTransformer(babelOptions)`;
+
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createJestPreprocessFile error:', err.message);
+    } else {
+      console.log('createTestSuit.util createJestPreprocessFile written successfully');
+    }
+  });
+}
+
+async function createComponentTests(path: string, appName: string, components: Component[]) {
+  const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
+  const data:string = '';
+
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createComponentTests error:', err.message);
+    } else {
+      console.log('createTestSuit.util createComponentTests written successfully');
+    }
+  });
+}
+
 async function createTestSuite({
   path,
   appName,
@@ -90,6 +151,9 @@ async function createTestSuite({
   await initFolders(path, appName);
   await createMocksFiles(path, appName);
   await createTestsFiles(path, appName);
+  await createJestConfigFile(path, appName);
+  await createJestPreprocessFile(path, appName);
+  await createComponentTests(path, appName, components);
 }
 
 export default createTestSuite;
\ No newline at end of file

From f9017093a63b347cfe61fe61e55174fe51f1e771 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Sat, 18 Sep 2021 12:22:16 -0700
Subject: [PATCH 10/22] finished setting up Gastby app test connect exports,
 ready for unit testing, Philip, https://github.com/pmhua, Daniel
 https://github.com/dreille, William https://github.com/wbrittwage, Miles
 https://github.com/Miles818

---
 app/src/helperFunctions/generateCode.ts |  2 +-
 app/src/utils/createGatsbyApp.util.ts   | 19 ++++++++--
 app/src/utils/createTestSuite.util.ts   | 47 ++++++++++++++++++++++++-
 3 files changed, 64 insertions(+), 4 deletions(-)

diff --git a/app/src/helperFunctions/generateCode.ts b/app/src/helperFunctions/generateCode.ts
index 6433bf568..88e96942e 100644
--- a/app/src/helperFunctions/generateCode.ts
+++ b/app/src/helperFunctions/generateCode.ts
@@ -274,7 +274,7 @@ const generateUnformattedCode = (
     ${links ? `import { Link } from 'gatsby'` : ``}
    
 
-      const ${currentComponent.name} = (props): JSX.Element => {
+      const ${currentComponent.name} = (props: any): JSX.Element => {
 
         const  [value, setValue] = useState<any | undefined>("INITIAL VALUE");
 
diff --git a/app/src/utils/createGatsbyApp.util.ts b/app/src/utils/createGatsbyApp.util.ts
index 8c2a33569..b959aa8a2 100644
--- a/app/src/utils/createGatsbyApp.util.ts
+++ b/app/src/utils/createGatsbyApp.util.ts
@@ -79,9 +79,24 @@ export const createPackage = (path, appName, test) => {
 };
 //createTSConfig (empty)
 export const createTsConfig = (path, appName) => {
-  const filePath = `${path}/${appName}/tsconfig.json`;
+  const filePath:string = `${path}/${appName}/tsconfig.json`;
   //running 'gatsby dev' will autopopulate this with default values
-  window.api.writeFile(filePath, '', err => {
+  const data:string = `{
+  "compilerOptions": {
+    "outDir": "./dist/",
+    "sourceMap": true,
+    "noImplicitAny": true,
+    "module": "commonjs",
+    "target": "esnext",
+    "jsx": "react",
+    "lib": ["dom", "esnext"],
+    "moduleResolution": "node",
+    "esModuleInterop": true
+  },
+  "include": ["./src/**/*"]
+}
+`;
+  window.api.writeFile(filePath, data, err => {
     if (err) {
       console.log('TSConfig error:', err.message);
     } else {
diff --git a/app/src/utils/createTestSuite.util.ts b/app/src/utils/createTestSuite.util.ts
index 8a9298b10..bacce236d 100644
--- a/app/src/utils/createTestSuite.util.ts
+++ b/app/src/utils/createTestSuite.util.ts
@@ -121,8 +121,48 @@ async function createJestPreprocessFile(path: string, appName: string){
 
 async function createComponentTests(path: string, appName: string, components: Component[]) {
   const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
-  const data:string = '';
+  console.log(JSON.stringify(components))
+  console.log(components);
 
+  let data:string = `
+  import React from "react"
+  import renderer from "react-test-renderer"
+  import Enzyme, { shallow } from 'enzyme';
+
+
+  import Adapter from 'enzyme-adapter-react-16';
+  Enzyme.configure({ adapter: new Adapter() });
+  `;
+
+  components.forEach(page => {
+
+    let importString = `
+  import ${capitalize(page.name)} from "../src/pages/${page.name}";`;
+    data = data + importString;
+  })
+
+  //let describe = `describe("${page.name}", () => {`
+  components.forEach(page => {
+    data = data + `
+    
+  describe("${capitalize(page.name)}", () => {`
+  
+
+  data = data + `
+    it("renders correctly", () => {
+      const tree = renderer
+          .create(<${capitalize(page.name)} />)
+          .toJSON()
+      expect(tree).toMatchSnapshot()
+    })`
+
+
+    data = data + `
+  });`
+  })
+
+  
+  
   window.api.writeFile(filePath, data, err => {
     if (err) {
       console.log('createTestSuite.util createComponentTests error:', err.message);
@@ -132,6 +172,11 @@ async function createComponentTests(path: string, appName: string, components: C
   });
 }
 
+const capitalize = (string: string) => {
+  return string.charAt(0).toUpperCase() + string.slice(1);
+}
+
+
 async function createTestSuite({
   path,
   appName,

From cc117fbae342f67f0f3fa64bffd199a13e5dc074 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Sat, 18 Sep 2021 16:31:15 -0700
Subject: [PATCH 11/22] finished setting up test connection files for classic
 react apps, just need test files, Philip, https://github.com/pmhua, Daniel
 https://github.com/dreille, William https://github.com/wbrittwage, Miles
 https://github.com/Miles818

---
 app/src/helperFunctions/generateCode.ts      |   2 +-
 app/src/utils/createApplication.util.ts      |  60 ++++---
 app/src/utils/createTestSuiteClassic.util.ts | 158 +++++++++++++++++++
 app/src/utils/exportProject.util.ts          |   2 +-
 4 files changed, 202 insertions(+), 20 deletions(-)
 create mode 100644 app/src/utils/createTestSuiteClassic.util.ts

diff --git a/app/src/helperFunctions/generateCode.ts b/app/src/helperFunctions/generateCode.ts
index 88e96942e..23aa4c89e 100644
--- a/app/src/helperFunctions/generateCode.ts
+++ b/app/src/helperFunctions/generateCode.ts
@@ -206,7 +206,7 @@ const generateUnformattedCode = (
     ${
       classBased
         ? `class ${currentComponent.name} extends Component {`
-        : `const ${currentComponent.name} = (props): JSX.Element => {`
+        : `const ${currentComponent.name} = (props: any): JSX.Element => {`
     }
 
     ${
diff --git a/app/src/utils/createApplication.util.ts b/app/src/utils/createApplication.util.ts
index df9efda7c..a7fc5f377 100644
--- a/app/src/utils/createApplication.util.ts
+++ b/app/src/utils/createApplication.util.ts
@@ -3,6 +3,8 @@
 import createFiles from './createFiles.util';
 import { Component} from '../interfaces/Interfaces';
 
+import createTestSuiteClassic from './createTestSuiteClassic.util'
+
 const camelToKebab= (camel:string) => {
   return camel.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();
 };
@@ -108,8 +110,19 @@ export const createDefaultCSS = (path, appName, components) => {
   });
 };
 
-export const createPackage = (path, appName) => {
+export const createPackage = (path, appName, test) => {
   const filePath = `${path}/${appName}/package.json`;
+   let tsjest = `,
+    "@types/enzyme": "^3.10.9",
+    "@types/jest": "^27.0.1",
+    "babel-jest": "^27.2.0",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.6",
+    "jest": "^27.2.0",
+    "@types/enzyme-adapter-react-16": "^1.0.6",
+    "ts-jest": "^27.0.5",
+    "enzyme-to-json": "^3.6.2"`;
+
   const data = `
 {
   "name": "reactype",
@@ -119,7 +132,9 @@ export const createPackage = (path, appName) => {
   "scripts": {
     "start": "node server/server.js",
     "build": "cross-env NODE_ENV=production webpack",
-    "dev": "cross-env NODE_ENV=development webpack-dev-server"
+    "dev": "cross-env NODE_ENV=development webpack-dev-server"${
+      test ? `,
+    "test": "jest"`: '' }
   },
   "nodemonConfig": {
     "ignore": [
@@ -160,7 +175,8 @@ export const createPackage = (path, appName) => {
     "typescript": "^3.8.3",
     "webpack": "^4.29.6",
     "webpack-cli": "^3.3.0",
-    "webpack-dev-server": "^3.2.1"
+    "webpack-dev-server": "^3.2.1"${
+      test ? tsjest : '' }
   }
 }
   `;
@@ -252,18 +268,20 @@ export const createBabel = (path, appName) => {
 export const createTsConfig = (path, appName) => {
   const filePath = `${path}/${appName}/tsconfig.json`;
   const data = `
-{
-  "compilerOptions": {
-    "outDir": "./dist/",
-    "sourceMap": true,
-    "noImplicitAny": true,
-    "module": "commonjs",
-    "target": "es6",
-    "jsx": "react",
-    "allowSyntheticDefaultImports": true
-  },
-  "include": ["./src/**/*"]
-}
+  {
+    "compilerOptions": {
+      "outDir": "./dist/",
+      "sourceMap": true,
+      "noImplicitAny": true,
+      "module": "commonjs",
+      "target": "es6",
+      "jsx": "react",
+      "lib": ["dom", "es6"],
+      "moduleResolution": "node",
+      "esModuleInterop": true
+    },
+    "include": ["./src/**/*"]
+  }
 `;
   window.api.writeFile(filePath, data, err => {
     if (err) {
@@ -340,23 +358,29 @@ app.listen(8080, () => {
 async function createApplicationUtil({
   path,
   appName,
-  components
+  components,
+  testchecked,
 }: {
   path: string;
   appName: string;
   components: Component[];
+  testchecked: boolean;
 }) {
   console.log('in the createApplication util');
-
+  console.log('testchecked: ',testchecked);
   await createIndexHtml(path, appName);
   await createIndexTsx(path, appName);
   await createDefaultCSS(path, appName, components);
-  await createPackage(path, appName);
+  await createPackage(path, appName, testchecked);
   await createWebpack(path, appName);
   await createBabel(path, appName);
   await createTsConfig(path, appName);
   await createTsLint(path, appName);
   await createServer(path, appName);
+  if (testchecked) {
+    console.log('entering createTestSuiteClassic');
+  await createTestSuiteClassic({path, appName, components, testchecked});
+  }
   await createFiles(components, path, appName, true);
 }
 export default createApplicationUtil;
diff --git a/app/src/utils/createTestSuiteClassic.util.ts b/app/src/utils/createTestSuiteClassic.util.ts
new file mode 100644
index 000000000..a58a411dc
--- /dev/null
+++ b/app/src/utils/createTestSuiteClassic.util.ts
@@ -0,0 +1,158 @@
+
+
+
+const initFolders = (path: string, appName: string) => {
+  console.log(window); // remember to delete
+  let dir = path;
+  dir = `${dir}/${appName}`;
+  if (!window.api.existsSync(`${dir}/__tests__`)) {
+    window.api.mkdirSync(`${dir}/__tests__`);
+  }
+}
+
+const createJestConfigFile = (path: string, appName: string) => {
+const filePath:string = `${path}/${appName}/jest.config.js`;
+const data:String= `
+module.exports = {
+  snapshotSerializers: ["enzyme-to-json/serializer"],
+  transform: {
+    "^.+\\.tsx?$": "ts-jest",
+    "^.+\\.jsx?$": "<rootDir>/jest-preprocess.js",
+  },
+  testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.([tj]sx?)$",
+  moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],
+  testPathIgnorePatterns: ["node_moules", ".cache"],
+  globals: {
+    __PATH_PREFIX__: "",
+  }
+} `
+
+
+window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuiteClassic.util createJestConfigFile error:', err.message);
+    } else {
+      console.log('createTestSuiteClassic.util createJestConfigFile written successfully');
+    }
+  });
+};
+
+const createJestPreprocessFile = (path: string, appName: string) => {
+  const filePath: string = `${path}/${appName}/jest-preprocess.js`;
+  const data: string = `
+  module.exports = require("babel-jest")`;
+
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createJestPreprocessFile error:', err.message);
+    } else {
+      console.log('createTestSuit.util createJestPreprocessFile written successfully');
+    }
+  });
+}
+
+async function createComponentTests(path: string, appName: string, components: Component[]) {
+    const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
+    console.log(JSON.stringify(components))
+    console.log(components);
+  
+    let data:string = `
+    import { shallow } from 'enzyme'
+    import React from 'react';
+
+    import * as Enzyme from 'enzyme'
+    import Adapter from 'enzyme-adapter-react-16'
+
+    Enzyme.configure({
+        adapter: new Adapter(),
+})
+    `;
+  
+    components.forEach(page => {
+  
+      let importString = `
+    import ${capitalize(page.name)} from "../src/components/${page.name}";`;
+      data = data + importString;
+    })
+  
+    //let describe = `describe("${page.name}", () => {`
+    components.forEach(page => {
+      data = data + `
+      
+    describe("${capitalize(page.name)}", () => {`
+    
+  
+    data = data + `
+    it('renders snapshots, too', () => {
+        const wrapper = shallow(< ${capitalize(page.name)} />)
+        expect(wrapper).toMatchSnapshot()
+      })`
+  
+  
+      data = data + `
+    });`
+    })
+  
+    
+    
+    window.api.writeFile(filePath, data, err => {
+      if (err) {
+        console.log('createTestSuite.util createComponentTests error:', err.message);
+      } else {
+        console.log('createTestSuit.util createComponentTests written successfully');
+      }
+    });
+  }
+  
+  const capitalize = (string: string) => {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+  }
+  
+// //////////////////////////
+// // DELETE BELOW AFTERWARDS
+// import { shallow } from 'enzyme'
+// import React from 'react';
+
+// import * as Enzyme from 'enzyme'
+// import Adapter from 'enzyme-adapter-react-16'
+
+// Enzyme.configure({
+//   adapter: new Adapter(),
+// })
+
+// describe('Hello, Enzyme!', () => {
+//   it('renders', () => {
+//     const wrapper = shallow(<div>
+//       <h1>Hello, Enzyme!</h1>
+//     </div>)
+//     expect(wrapper.find('h1').html()).toMatch(/Hello, Enzyme/)
+//   })
+
+//   it('renders snapshots, too', () => {
+//     const wrapper = shallow(< />)
+//     expect(wrapper).toMatchSnapshot()
+//   })
+// })
+// // DELETE ABOVE AFTERWARDS
+// //////////////////////////
+async function createTestSuiteClassic({
+  path,
+  appName,
+  components,
+  testchecked,
+}: {
+  path: string;
+  appName: string;
+  components: Component[];
+  testchecked: boolean;
+}) {
+  console.log('in the createClassicApplication util');
+  console.log('testchecked: ', testchecked);
+
+  await initFolders(path, appName);
+  await createJestConfigFile(path, appName);
+  await createJestPreprocessFile(path, appName);
+  await createComponentTests(path, appName, components);
+}
+
+export default createTestSuiteClassic;
\ No newline at end of file
diff --git a/app/src/utils/exportProject.util.ts b/app/src/utils/exportProject.util.ts
index e5b90b527..5385efabd 100644
--- a/app/src/utils/exportProject.util.ts
+++ b/app/src/utils/exportProject.util.ts
@@ -15,7 +15,7 @@ const exportProject = (
 ) => {
   // Create fully functional classic react application
   if (genOption === 1 && projectType === 'Classic React') {
-    createApplicationUtil({ path, appName, components }).catch(err =>
+    createApplicationUtil({ path, appName, components, testchecked: tests }).catch(err =>
       console.log(err)
     );
   } // export all component files, but don't create all application files

From 429d3c96ba251044b94dfdd7579048d03252fc3a Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Mon, 20 Sep 2021 14:38:54 -0700
Subject: [PATCH 12/22] finished setting up test exports for Next App, Philip
 <https://github.com/pmhua>

---
 app/src/utils/createNextApp.util.ts       |  82 +++++++-
 app/src/utils/createTestSuite.util.ts     |   1 -
 app/src/utils/createTestSuiteNext.util.ts | 218 ++++++++++++++++++++++
 app/src/utils/exportProject.util.ts       |   2 +-
 4 files changed, 292 insertions(+), 11 deletions(-)
 create mode 100644 app/src/utils/createTestSuiteNext.util.ts

diff --git a/app/src/utils/createNextApp.util.ts b/app/src/utils/createNextApp.util.ts
index 1f06edfd4..c3538afaf 100644
--- a/app/src/utils/createNextApp.util.ts
+++ b/app/src/utils/createNextApp.util.ts
@@ -3,6 +3,8 @@
 import createNextFiles from './createNextFiles.util';
 import { Component } from '../interfaces/Interfaces';
 
+import createTestSuiteNext from './createTestSuiteNext.util';
+
 const camelToKebab= (camel:string) => {
   return camel.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();
 };
@@ -24,8 +26,20 @@ const compToCSS = (component: Component) => {
 }
 
 //createPackage
-export const createPackage = (path, appName) => {
+export const createPackage = (path, appName, test) => {
   const filePath = `${path}/${appName}/package.json`;
+
+  let testpackages = `,
+    "@types/enzyme": "^3.10.9",
+    "@types/jest": "^27.0.1",
+    "babel-jest": "^27.2.0",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.6",
+    "jest": "^27.2.0",
+    "@types/enzyme-adapter-react-16": "^1.0.6",
+    "identity-obj-proxy": "^3.0.0",
+    "ts-jest": "^27.0.5"`;
+
   const data = `
 {
   "name": "reactype-next",
@@ -34,7 +48,9 @@ export const createPackage = (path, appName) => {
   "scripts": {
     "dev": "next dev",
     "build": "next build",
-    "start": "next start"
+    "start": "next start"${
+      test ? `,
+    "test": "jest"`: '' }
   },
   "dependencies": {
     "next": "9.3.5",
@@ -44,15 +60,18 @@ export const createPackage = (path, appName) => {
   "devDependencies": {
     "@types/node": "^14.0.20",
     "@types/react": "^16.9.41",
-    "typescript": "^3.9.6"
+    "@types/react-dom": "^17.0.9",
+    "typescript": "^3.9.6"${
+      test ? testpackages : '' 
+  }
   }
 }
-  `;
+`;
   window.api.writeFile(filePath, data, err => {
     if (err) {
-      console.log('package.json error:', err.message);
+      console.log('createNextApp.util package.json error:', err.message);
     } else {
-      console.log('package.json written successfully');
+      console.log('createNextApp.util package.json written successfully');
     }
   });
 };
@@ -60,7 +79,46 @@ export const createPackage = (path, appName) => {
 export const createTsConfig = (path, appName) => {
   const filePath = `${path}/${appName}/tsconfig.json`;
   //running 'next dev' will autopopulate this with default values
-  window.api.writeFile(filePath, '', err => {
+  const data:string = `{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "esnext",
+    "jsx": "preserve",
+    "allowJs": true,
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "removeComments": false,
+    "preserveConstEnums": true,
+    "sourceMap": true,
+    "skipLibCheck": true,
+    "baseUrl": ".",
+    "lib": [
+      "dom",
+      "es2016"
+    ],
+    "strict": false,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+} 
+`;
+
+
+  window.api.writeFile(filePath, data, err => {
     if (err) {
       console.log('TSConfig error:', err.message);
     } else {
@@ -139,20 +197,26 @@ async function createNextAppUtil({
   path,
   appName,
   components,
-  rootComponents
+  rootComponents,
+  testchecked,
 }: {
   path: string;
   appName: string;
   components: Component[];
   rootComponents: number[];
+  testchecked: boolean;
 }) {
   console.log('in the createNextApplication util');
 
   await initFolders(path, appName);
   await createBaseTsx(path, appName);
   await createDefaultCSS(path, appName, components);
-  await createPackage(path, appName);
+  await createPackage(path, appName, testchecked);
   await createTsConfig(path, appName);
+  if (testchecked) {
+    console.log('testchecked: ',testchecked);
+    await createTestSuiteNext({path, appName, components, rootComponents, testchecked});
+  }
   await createNextFiles(components, path, appName, rootComponents);
 
 }
diff --git a/app/src/utils/createTestSuite.util.ts b/app/src/utils/createTestSuite.util.ts
index bacce236d..bd5777ab6 100644
--- a/app/src/utils/createTestSuite.util.ts
+++ b/app/src/utils/createTestSuite.util.ts
@@ -7,7 +7,6 @@
 // }
 
 const initFolders = (path: string, appName: string) => {
-  console.log(window); // remember to delete
   let dir = path;
   dir = `${dir}/${appName}`;
   if (!window.api.existsSync(`${dir}/__mocks__`)) {
diff --git a/app/src/utils/createTestSuiteNext.util.ts b/app/src/utils/createTestSuiteNext.util.ts
new file mode 100644
index 000000000..48eb8ae00
--- /dev/null
+++ b/app/src/utils/createTestSuiteNext.util.ts
@@ -0,0 +1,218 @@
+
+
+const initFolders = (path: string, appName: string) => {
+  let dir = path;
+  dir = `${dir}/${appName}`;
+  if (!window.api.existsSync(`${dir}/__mocks__`)) {
+    window.api.mkdirSync(`${dir}/__mocks__`);
+  }
+  if (!window.api.existsSync(`${dir}/__tests__`)) {
+    window.api.mkdirSync(`${dir}/__tests__`);
+  }
+}
+
+async function createJestConfigFile(path: String, appName: String){
+  const filePath:string = `${path}/${appName}/jest.config.js`;
+  const data:string = `
+module.exports = {
+  moduleFileExtensions: [
+    "ts",
+    "tsx",
+    "js"
+  ],
+  transform: {
+    "^.+\\.tsx?$": "ts-jest",
+    "^.+\\.jsx?$": "<rootDir>/jest-preprocess.js",
+
+  },
+  testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.([tj]sx?)$",
+  globals: {
+    "ts-jest": {
+      babelConfig: true,
+      tsconfig: "jest.tsconfig.json"
+    }
+  },
+  coveragePathIgnorePatterns: [
+    "/node_modules/",
+    "enzyme.js"
+  ],
+  setupFilesAfterEnv: ["<rootDir>/enzyme.js"],
+  coverageReporters: [
+    "json",
+    "lcov",
+    "text",
+    "text-summary"
+  ],
+  moduleNameMapper: {
+    "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/file-mock.js",
+    "\\.(css|less|scss)$": "identity-obj-proxy"
+  }
+}
+`;
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuiteNext.util createJestConfigFile error:', err.message);
+    } else {
+      console.log('createTestSuitNext.util createJestConfigFile written successfully');
+    }
+  });
+};
+
+async function createJestTsconfigJsonFile(path: String, appName: String){
+  console.log('got in create jest tsconfig');
+  const filePath:string = `${path}/${appName}/jest.tsconfig.json`;
+  const data:string = `
+{
+  "compilerOptions": {
+    "module": "commonjs",
+    "target": "esnext",
+    "jsx": "react",
+    "sourceMap": false,
+    "experimentalDecorators": true,
+    "noImplicitUseStrict": true,
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "lib": [
+      "es2017",
+      "dom"
+    ],
+    "typeRoots": [
+      "node_modules/@types"
+    ]
+  },
+  "exclude": [
+    "node_modules",
+    "out",
+    ".next"
+  ]
+}
+`;
+  console.log(data);
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuiteNext.util createJestTsconfigJsonFile error:', err.message);
+    } else {
+      console.log('createTestSuitNext.util createJestTsconfigJsonFile written successfully');
+    }
+  });
+};
+
+
+async function createJestPreprocessFile(path: string, appName: string){
+  const filePath: string = `${path}/${appName}/jest-preprocess.js`;
+  const data:string = `
+const babelOptions = {
+  presets: ["next/babel"],
+}
+
+module.exports = require("babel-jest").default.createTransformer(babelOptions)`;
+
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createJestPreprocessFile error:', err.message);
+    } else {
+      console.log('createTestSuit.util createJestPreprocessFile written successfully');
+    }
+  });
+}
+
+async function createEnzymeFile(path: string, appName: string){
+  const filePath: string = `${path}/${appName}/enzyme.js`;
+  const data:string = `const Adapter = require('enzyme-adapter-react-16');
+require('enzyme').configure({adapter: new Adapter()});`;
+
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuite.util createEnzymeFile error:', err.message);
+    } else {
+      console.log('createTestSuit.util createEnzymeFile written successfully');
+    }
+  });
+}
+
+async function createComponentTests(path: string, appName: string, components: Component[]) {
+  const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
+  console.log(JSON.stringify(components))
+  console.log(components);
+
+  let data:string = `
+  import { shallow } from 'enzyme'
+  import React from 'react';
+  `;
+
+  components.forEach(page => {
+    console.log(page);
+    let importString = '';
+    if (page.isPage) {
+      importString = `
+import ${capitalize(page.name)} from "../pages/${page.name}";`;
+      data = data + importString;
+    } else {
+      importString = `
+import ${capitalize(page.name)} from "../components/${page.name}";`;
+      data = data + importString;
+    }
+  })
+
+  //let describe = `describe("${page.name}", () => {`
+  components.forEach(page => {
+    data = data + `
+    
+  describe("${capitalize(page.name)}", () => {`
+  
+
+  data = data + `
+  it('renders snapshots, too', () => {
+      const wrapper = shallow(< ${capitalize(page.name)} />)
+      expect(wrapper).toMatchSnapshot()
+    })`
+
+
+    data = data + `
+  });`
+  })
+
+  
+  
+  window.api.writeFile(filePath, data, err => {
+    if (err) {
+      console.log('createTestSuiteNext.util createComponentTests error:', err.message);
+    } else {
+      console.log('createTestSuitNext.util createComponentTests written successfully');
+    }
+  });
+}
+
+const capitalize = (string: string) => {
+  return string.charAt(0).toUpperCase() + string.slice(1);
+}
+
+
+async function createTestSuite({
+  path,
+  appName,
+  components,
+  rootComponents,
+  testchecked,
+}: {
+  path: string;
+  appName: string;
+  components: Component[];
+  rootComponents: number[];
+  testchecked: boolean;
+}) {
+  console.log('in the createGatsbyApplication util');
+  console.log('testchecked: ', testchecked);
+
+  await initFolders(path, appName);
+  // await createMocksFiles(path, appName);
+  // await createTestsFiles(path, appName);
+  await createJestConfigFile(path, appName);
+  await createJestTsconfigJsonFile(path, appName);
+  await createJestPreprocessFile(path, appName);
+  await createEnzymeFile(path, appName);
+  await createComponentTests(path, appName, components);
+}
+
+export default createTestSuite;
\ No newline at end of file
diff --git a/app/src/utils/exportProject.util.ts b/app/src/utils/exportProject.util.ts
index 5385efabd..e14522336 100644
--- a/app/src/utils/exportProject.util.ts
+++ b/app/src/utils/exportProject.util.ts
@@ -23,7 +23,7 @@ const exportProject = (
     createFiles(components, path, appName, false);
   } // Create fully functional Next.js and Gatsby.js application files
   else if (genOption === 1 && projectType === 'Next.js') {
-    createNextApp({ path, appName, components, rootComponents }).catch(err =>
+    createNextApp({ path, appName, components, rootComponents, testchecked: tests }).catch(err =>
       console.log(err)
     );
   } else if (genOption === 1 && projectType === 'Gatsby.js') {

From 8a0a25b96b7f9e96c4a4316e0094152bdd21a400 Mon Sep 17 00:00:00 2001
From: dreille <66196129+dreille@users.noreply.github.com>
Date: Mon, 20 Sep 2021 14:45:21 -0700
Subject: [PATCH 13/22] Branch created Co-authored-by: wbrittwage
 <wbrittwage@users.noreply.github.com> Co-authored-by: Miles818
 <Miles818@users.noreply.github.com>

---
 app/src/Dashboard/ProjectContainer.tsx | 2 +-
 app/src/components/left/HTMLPanel.tsx  | 7 +++++--
 app/src/containers/AppContainer.tsx    | 2 +-
 app/src/public/styles/theme.ts         | 6 +++---
 4 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/app/src/Dashboard/ProjectContainer.tsx b/app/src/Dashboard/ProjectContainer.tsx
index 9579c433e..73b230c4b 100644
--- a/app/src/Dashboard/ProjectContainer.tsx
+++ b/app/src/Dashboard/ProjectContainer.tsx
@@ -2,7 +2,7 @@ import React, {
   useState, useContext, useEffect, createContext,
 } from 'react';
 import {
-  createMuiTheme, MuiThemeProvider, makeStyles, Theme, useTheme,
+  createTheme, MuiThemeProvider, makeStyles, Theme, useTheme,
 } from '@material-ui/core/styles';
 import { useQuery } from '@apollo/client';
 
diff --git a/app/src/components/left/HTMLPanel.tsx b/app/src/components/left/HTMLPanel.tsx
index a2cc809f2..e563da318 100644
--- a/app/src/components/left/HTMLPanel.tsx
+++ b/app/src/components/left/HTMLPanel.tsx
@@ -2,6 +2,8 @@ import React, { useState, useCallback, useContext, useEffect } from 'react';
 import Grid from '@material-ui/core/Grid';
 import StateContext from '../../context/context';
 import HTMLItem from './HTMLItem';
+// import { styleContext } from './AppContainer';
+
 import { makeStyles, styled } from '@material-ui/core/styles';
 import {
   Button,
@@ -32,6 +34,7 @@ const HTMLPanel = (props): JSX.Element => {
   const [errorStatus, setErrorStatus] = useState(false);
   const [state, dispatch] = useContext(StateContext);
   const {isThemeLight} = props;
+  // const { style } = useContext(styleContext);
   let startingID = 0;
   state.HTMLTypes.forEach(element => {
     if (element.id >= startingID) startingID = element.id;
@@ -156,12 +159,12 @@ const HTMLPanel = (props): JSX.Element => {
   }, []);
 
   return (
-    <div className="HTMLItemCreate">
+    <div className="HTMLItemCreate" >
       <div className={classes.addComponentWrapper}>
         <div className={classes.inputWrapper}>
           <form onSubmit={handleSubmit} className="customForm">
 
-            <h4 className={isThemeLight ? classes.lightThemeFontColor : classes.darkThemeFontColor }>New HTML Tag: </h4>
+            <h4 className={isThemeLight ? classes.lightThemeFontColor : classes.darkThemeFontColor } value = "New HTML Tag">New HTML Tag: </h4>
             <InputLabel className={isThemeLight ? `${classes.inputLabel} ${classes.lightThemeFontColor}` : `${classes.inputLabel} ${classes.darkThemeFontColor}`}>
               Tag:
             </InputLabel>
diff --git a/app/src/containers/AppContainer.tsx b/app/src/containers/AppContainer.tsx
index f72d12928..56faf60fa 100644
--- a/app/src/containers/AppContainer.tsx
+++ b/app/src/containers/AppContainer.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useContext, createContext } from 'react';
-import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles';
+import { createTheme, MuiThemeProvider } from '@material-ui/core/styles';
 // import Button from '@material-ui/core/Button';
 import NavBar from '../components/top/NavBar';
 import LeftContainer from './LeftContainer';
diff --git a/app/src/public/styles/theme.ts b/app/src/public/styles/theme.ts
index 7afd8de30..bb4440b92 100644
--- a/app/src/public/styles/theme.ts
+++ b/app/src/public/styles/theme.ts
@@ -1,6 +1,6 @@
-import { createMuiTheme } from '@material-ui/core/styles';
+import { createTheme } from '@material-ui/core/styles';
 
-export const theme1 = createMuiTheme({
+export const theme1 = createTheme({
   
   
   palette: {
@@ -14,7 +14,7 @@ export const theme1 = createMuiTheme({
 });
 
 
-export const theme2 = createMuiTheme({
+export const theme2 = createTheme({
   palette: {
     secondary: {
       main: '#304D6D', // dark mode color

From de69300404d7d69e3efae329a749b277340d27ec Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Mon, 20 Sep 2021 16:12:14 -0700
Subject: [PATCH 14/22] fixed darkmode background for creation tab, Philip,
 https://github.com/pmhua, Daniel https://github.com/dreille, William
 https://github.com/wbrittwage, Miles https://github.com/Miles818

---
 app/src/components/bottom/BottomTabs.tsx    | 6 ++++--
 app/src/components/bottom/CreationPanel.tsx | 4 +++-
 app/src/components/right/ComponentPanel.tsx | 3 +--
 app/src/public/styles/style.css             | 3 +--
 4 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/app/src/components/bottom/BottomTabs.tsx b/app/src/components/bottom/BottomTabs.tsx
index 92465184c..144faa71a 100644
--- a/app/src/components/bottom/BottomTabs.tsx
+++ b/app/src/components/bottom/BottomTabs.tsx
@@ -46,7 +46,7 @@ const BottomTabs = (props): JSX.Element => {
   Arrow.renderArrow(state.canvasFocus.childId);
 
   return (
-    <div className={classes.root} style={style}>
+    <div className={`${classes.root} ${classes.rootLight}`} style={style}>
       <Box display="flex" justifyContent="space-between" alignItems="center" paddingBottom="10px" paddingRight="10px">
         <Tabs
           value={tab}
@@ -111,12 +111,14 @@ const BottomTabs = (props): JSX.Element => {
 const useStyles = makeStyles(theme => ({
   root: {
     flexGrow: 1,
-    backgroundColor: '#003366',
     height: '100%',
     color: '#E8E8E8',
     boxShadow: '0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)',
     
   },
+  rootLight: isThemeLight => ({
+    backgroundColor: isThemeLight ? '#003366': 'rgb(33,34,45)'
+  }),
   bottomHeader: {
     flex: 1,
     flexDirection: 'row',
diff --git a/app/src/components/bottom/CreationPanel.tsx b/app/src/components/bottom/CreationPanel.tsx
index 4c398fdff..6b5c55bd8 100644
--- a/app/src/components/bottom/CreationPanel.tsx
+++ b/app/src/components/bottom/CreationPanel.tsx
@@ -2,12 +2,14 @@ import React, { useContext } from 'react';
 import ComponentPanel from '../right/ComponentPanel'
 import StatePropsPanel from '../right/StatePropsPanel'
 import HTMLPanel from '../left/HTMLPanel'
+import { styleContext } from '../../containers/AppContainer';
 
 // Creation panel holds all of the creation functionality of the application. ComponentPanel, HTMLPanel, and StatePropsPanel are all hanged here.
 // This allows users to create all aspects of this application in one place.
 const CreationPanel = (props): JSX.Element => {
+  const {style} = useContext(styleContext);
   return (
-    <div className="creation-panel" >
+    <div className="creation-panel" style={style}>
       <ComponentPanel isThemeLight={props.isThemeLight}/>
       <HTMLPanel isThemeLight={props.isThemeLight}/>
       <StatePropsPanel isThemeLight={props.isThemeLight}/>
diff --git a/app/src/components/right/ComponentPanel.tsx b/app/src/components/right/ComponentPanel.tsx
index 82f0d87cb..0b3750665 100644
--- a/app/src/components/right/ComponentPanel.tsx
+++ b/app/src/components/right/ComponentPanel.tsx
@@ -125,7 +125,7 @@ const ComponentPanel = ({isThemeLight}): JSX.Element => {
   }, []);
 
   return (
-    <div className={classes.panelWrapper}>
+    <div className={`${classes.panelWrapper}`}>
       {/* Add a new component*/}
       <div className={classes.addComponentWrapper}>
           <h4 
@@ -216,7 +216,6 @@ const useStyles = makeStyles({
     flexDirection:'column',
     alignItems:'center',
     flexGrow : 1,
-    backgroundColor: '#F9F9F9',
     color: '#000000',
   },
   addComponentWrapper: {
diff --git a/app/src/public/styles/style.css b/app/src/public/styles/style.css
index 9f231e81c..78b0fee83 100644
--- a/app/src/public/styles/style.css
+++ b/app/src/public/styles/style.css
@@ -31,6 +31,7 @@ h4 {
   display: flex;
   flex-direction: row;
   height: 100%;
+  background-color: #fff;
 }
 
 .customization-section {
@@ -45,7 +46,6 @@ h4 {
   display: flex;
   flex-direction: row;
   justify-content: space-evenly;
-  background-color: #F9F9F9;
 }
 
 .state-prop-grid {
@@ -56,7 +56,6 @@ h4 {
 
 .HTMLItemCreate {
   flex-grow: 1;
-  background-color: #F9F9F9;
   justify-content: center;
 }
 /*

From d57327f458e20e18fd42293399d58815218f25b5 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Mon, 20 Sep 2021 18:55:56 -0700
Subject: [PATCH 15/22] fixed prod script - added node to open server.js file,
 Philip, https://github.com/pmhua, Daniel https://github.com/dreille, William
 https://github.com/wbrittwage, Miles https://github.com/Miles818

---
 server/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/server/package.json b/server/package.json
index d34cf02f5..59121fba4 100644
--- a/server/package.json
+++ b/server/package.json
@@ -10,7 +10,7 @@
     "test": "jest --verbose ",
     "test:watch": "jest --watch",
     "start": "cross-env NODE_ENV=production node server.js",
-    "prod": "cross-env NODE_ENV=production server.js",
+    "prod": "cross-env NODE_ENV=production node server.js",
     "dev": "cross-env NODE_ENV=development nodemon server.js"
   },
   "keywords": [],

From 113a00b2f21a79815f3c11452e1c8c1a0679c613 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Tue, 21 Sep 2021 10:19:52 -0700
Subject: [PATCH 16/22] solve css styling rewriting mui defaults
 Co-authored-by: Philip Hua <philiphuahhhh@gmail.com>     Co-authored-by:
 Miles Wright <Miles818@users.noreply.github.com>     Co-authored-by: William
 Rittwage  <wbrittwage@users.noreply.github.com> Co-authored-by: Daniel
 Reilley <dannyreilley@gmail.com>

---
 app/src/components/bottom/BottomTabs.tsx     |  2 +-
 app/src/components/right/StatePropsPanel.tsx | 29 ++++++++++++++++++--
 2 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/app/src/components/bottom/BottomTabs.tsx b/app/src/components/bottom/BottomTabs.tsx
index 144faa71a..64bdbfde4 100644
--- a/app/src/components/bottom/BottomTabs.tsx
+++ b/app/src/components/bottom/BottomTabs.tsx
@@ -117,7 +117,7 @@ const useStyles = makeStyles(theme => ({
     
   },
   rootLight: isThemeLight => ({
-    backgroundColor: isThemeLight ? '#003366': 'rgb(33,34,45)'
+    backgroundColor: isThemeLight ? 'blue': 'red'
   }),
   bottomHeader: {
     flex: 1,
diff --git a/app/src/components/right/StatePropsPanel.tsx b/app/src/components/right/StatePropsPanel.tsx
index d13dfb9ab..c874dc931 100644
--- a/app/src/components/right/StatePropsPanel.tsx
+++ b/app/src/components/right/StatePropsPanel.tsx
@@ -5,6 +5,9 @@ import {
   makeStyles,
   styled,
   Theme,
+  createTheme,
+  ThemeProvider,
+  withStyles
 } from "@material-ui/core/styles";
 import Button from "@material-ui/core/Button";
 import {
@@ -24,6 +27,7 @@ import {
 import StateContext from "../../context/context";
 import TableStateProps from "./TableStateProps";
 
+
 const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
   const classes = useStyles();
   const [state] = useContext(StateContext);
@@ -126,14 +130,16 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
             variant="outlined"
             value={inputKey}
             onChange={(e) => setInputKey(e.target.value)}
-          />
+            className={isThemeLight ? classes.rootLight : classes.rootDark} 
+            />
           <TextField
             id="textfield-value"
+            className={isThemeLight ? classes.rootLight : classes.rootDark} 
             label="value:"
             variant="outlined"
             value={inputValue}
             onChange={(e) => setInputValue(e.target.value)}
-          />
+            />
           <FormControl required className={classes.formControl}>
             <InputLabel id="select-required-label">Type</InputLabel>
             <Select
@@ -188,7 +194,7 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
 };
 
 const useStyles = makeStyles((theme: Theme) =>
-  createStyles({
+  ({
     inputField: {
       marginTop: "10px",
       borderRadius: "5px",
@@ -294,6 +300,22 @@ const useStyles = makeStyles((theme: Theme) =>
     selectEmpty: {
       marginTop: theme.spacing(2),
     },
+    color: {
+      color: '#fff',
+    },
+    rootLight: {
+      '& .MuiFormLabel-root': {
+        color: 'rgba(0,0,0,0.54)'
+      }
+    },
+    rootDark: {
+      '& .MuiFormLabel-root': {
+        color: '#fff'
+      },
+      '& .MuiOutlinedInput-notchedOutline': {
+        borderColor: '#fff'
+      }
+    }
   })
 );
 
@@ -308,4 +330,5 @@ const MyButton = styled(Button)({
   padding: "0 30px",
 });
 
+
 export default StatePropsPanel;

From 687566814f79451fc9cdf040fbfeabc1e09d19ea Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Tue, 21 Sep 2021 12:31:37 -0700
Subject: [PATCH 17/22] working on grid styling, Co-authored-by: Philip Hua
 <philiphuahhhh@gmail.com> Co-authored-by: Miles Wright
 <mileswright818@gmail.com> Co-authored-by: William Rittwage 
 <wbrittwage@protonmail.com> Co-authored-by: Daniel Reilley
 <dannyreilley@gmail.com>

---
 app/src/components/right/StatePropsPanel.tsx | 50 +++++++++++++++++---
 app/src/components/right/TableStateProps.tsx | 33 +++++++++++--
 app/src/containers/CustomizationPanel.tsx    |  9 ++++
 3 files changed, 81 insertions(+), 11 deletions(-)

diff --git a/app/src/components/right/StatePropsPanel.tsx b/app/src/components/right/StatePropsPanel.tsx
index c874dc931..01b4416bd 100644
--- a/app/src/components/right/StatePropsPanel.tsx
+++ b/app/src/components/right/StatePropsPanel.tsx
@@ -123,7 +123,7 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
     <div className={'state-panel'}>
       <div>
         <FormControl>
-          <h4>Create New State</h4>
+          <h4 className={isThemeLight ? classes.lightThemeFontColor : classes.darkThemeFontColor}>Create New State</h4>
           <TextField
             id="textfield-key"
             label="key:"
@@ -140,12 +140,16 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
             value={inputValue}
             onChange={(e) => setInputValue(e.target.value)}
             />
-          <FormControl required className={classes.formControl}>
-            <InputLabel id="select-required-label">Type</InputLabel>
+          <FormControl required className={isThemeLight ? `${classes.formControl} ${classes.lightThemeFontColor}` : `${classes.formControl} ${classes.darkThemeFontColor}`}>
+            <InputLabel 
+              id="select-required-label"
+              className={isThemeLight ? classes.greyThemeFontColor : classes.darkThemeFontColor}>
+                Type
+            </InputLabel>
             <Select
               labelId="select-required-label"
               id="type-input"
-              className={classes.selectEmpty}
+              className={isThemeLight ? `${classes.selectEmpty} ${classes.rootUnderlineLight}` : `${classes.selectEmpty} ${classes.rootUnderlineDark}`}
               value={inputType}
               onChange={(event, index) => setInputType(index.props.value)}
             >
@@ -171,7 +175,10 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
                 Any
               </MenuItem>
             </Select>
-            <FormHelperText>Required</FormHelperText>
+            <FormHelperText
+              className={isThemeLight ? classes.greyThemeFontColor : classes.darkThemeFontColor}>
+                Required
+            </FormHelperText>
           </FormControl>
           <br></br>
           <MyButton 
@@ -186,8 +193,10 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
       </div>
       <br></br>
       <div>
-        <h4>Current State Name: {state.components[state.canvasFocus.componentId - 1].name}</h4>
-        <TableStateProps selectHandler={handlerRowSelect} deleteHandler={handlerRowDelete} />
+        <h4  className={isThemeLight ? classes.lightThemeFontColor : classes.darkThemeFontColor}>
+          Current State Name: {state.components[state.canvasFocus.componentId - 1].name}
+        </h4>
+        <TableStateProps selectHandler={handlerRowSelect} deleteHandler={handlerRowDelete} isThemeLight={isThemeLight} />
       </div>
     </div>
   );
@@ -293,6 +302,9 @@ const useStyles = makeStyles((theme: Theme) =>
     darkThemeFontColor: {
       color: "#fff",
     },
+    greyThemeFontColor: {
+      color: 'rgba(0,0,0,0.54)',
+    },
     formControl: {
       margin: theme.spacing(1),
       minWidth: 120,
@@ -315,6 +327,30 @@ const useStyles = makeStyles((theme: Theme) =>
       '& .MuiOutlinedInput-notchedOutline': {
         borderColor: '#fff'
       }
+    },
+    underlineDark: {
+        borderBottom: '1px solid white'
+      
+    },
+    rootUnderlineDark: {
+      '& .MuiSelect-icon': {
+        color: '#fff',
+      },
+      // '& .MuiInput-underline': {
+        '&::before': {
+          borderBottom: '1px solid #fff'
+        }
+      // }
+    },
+        rootUnderlineLight: {
+      '& .MuiSelect-icon': {
+        color: 'rgba(0,0,0,0.54)',
+      },
+      // '& .MuiInput-underline': {
+        '&::before': {
+          borderBottom: '1px solid rgba(0,0,0,0.54)'
+        }
+      // }
     }
   })
 );
diff --git a/app/src/components/right/TableStateProps.tsx b/app/src/components/right/TableStateProps.tsx
index efe5386c5..93f677672 100644
--- a/app/src/components/right/TableStateProps.tsx
+++ b/app/src/components/right/TableStateProps.tsx
@@ -7,39 +7,46 @@ import {
 import Button from '@material-ui/core/Button';
 import ClearIcon from '@material-ui/icons/Clear';
 import StateContext from '../../context/context';
+import { makeStyles } from '@material-ui/core/styles';
 
 import { StatePropsPanelProps } from '../../interfaces/Interfaces';
 
 const getColumns = (props) => {
   const { deleteHandler } : StatePropsPanelProps = props;
+  console.log('isThemeLight: ',props.isThemeLight)
   return [
     {
       field: 'id',
       headerName: 'ID',
+      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 70,
       editable: false,
     },
     {
       field: 'key',
       headerName: 'Key',
+      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 90,
       editable: true,
     },
     {
       field: 'value',
       headerName: 'Value',
+      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 90,
       editable: true,
     },
     {
       field: 'type',
       headerName: 'Type',
+      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 90,
       editable: false,
     },
     {
       field: 'delete',
       headerName: 'X',
+      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 70,
       editable: false,
       renderCell: function renderCell(params:any) {
@@ -50,9 +57,9 @@ const getColumns = (props) => {
         };
         return ( 
           <Button style={{width:`${3}px`}}
-            onClick={() => {
-              deleteHandler(getIdRow());
-            }}>
+          onClick={() => {
+            deleteHandler(getIdRow());
+          }}>
             <ClearIcon style={{width:`${15}px`}}/>
           </Button>
         );
@@ -62,14 +69,20 @@ const getColumns = (props) => {
 };
 
 const TableStateProps = (props) => {
+  const classes = useStyles();
   const [state] = useContext(StateContext);
   const [editRowsModel] = useState <GridEditRowsModel> ({});
   const [gridColumns, setGridColumns] = useState([]);
+  
 
+  useEffect(() => {
+  console.log('isThemeLight: ',props.isThemeLight)
+    setGridColumns(getColumns(props));
+  }, [props.isThemeLight])
   // get currentComponent by using currently focused component's id
   const currentId = state.canvasFocus.componentId;
   const currentComponent = state.components[currentId - 1];
-
+  
   const rows = currentComponent.stateProps.slice();
 
   const { selectHandler } : StatePropsPanelProps = props;
@@ -87,9 +100,21 @@ const TableStateProps = (props) => {
         pageSize={5}
         editRowsModel={editRowsModel}
         onRowClick = {selectHandler}
+        headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
+
       />
     </div>
   );
 };
 
+
+const useStyles = makeStyles({
+  themeLight: {
+    color: 'rbga(0,0,0,054)'
+  },
+  themeDark: {
+    color: 'white'
+  }
+});
+
 export default TableStateProps;
diff --git a/app/src/containers/CustomizationPanel.tsx b/app/src/containers/CustomizationPanel.tsx
index eab20b9fd..2598df41b 100644
--- a/app/src/containers/CustomizationPanel.tsx
+++ b/app/src/containers/CustomizationPanel.tsx
@@ -735,6 +735,15 @@ const useStyles = makeStyles({
       border: isThemeLight ? '1px solid #808080' : '1px solid #ECECEA'
     }
   }),
+  // buttonRow: {
+  //   textAlign: 'center',
+  //   marginTop: '25px',
+  //   '& .MuiButton-textSecondary': {
+  //     color: '#808080', // color for delete page
+  //     border: '1px solid #808080' 
+  //   }
+  // },
+
   button: {
     fontSize: '1rem',
     paddingLeft: '20px',

From 801421c09a31e15d87108c3196119ba5b94fee08 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Tue, 21 Sep 2021 16:25:46 -0700
Subject: [PATCH 18/22] finished darkmode Co-authored-by: Philip Hua
 <philiphuahhhh@gmail.com> Co-authored-by: Miles Wright
 <mileswright818@gmail.com> Co-authored-by: William Rittwage 
 <wbrittwage@protonmail.com> Co-authored-by: Daniel Reilley
 <dannyreilley@gmail.com>

---
 app/src/components/left/HTMLPanel.tsx         | 10 +++++--
 app/src/components/right/ComponentDrag.tsx    |  1 +
 app/src/components/right/ComponentPanel.tsx   | 10 +++++--
 .../components/right/ComponentPanelItem.tsx   | 15 ++++++++---
 app/src/components/right/StatePropsPanel.tsx  | 16 ++++++++---
 app/src/components/right/TableStateProps.tsx  | 27 ++++++++++++-------
 6 files changed, 59 insertions(+), 20 deletions(-)

diff --git a/app/src/components/left/HTMLPanel.tsx b/app/src/components/left/HTMLPanel.tsx
index e563da318..34f849f60 100644
--- a/app/src/components/left/HTMLPanel.tsx
+++ b/app/src/components/left/HTMLPanel.tsx
@@ -271,10 +271,16 @@ const useStyles = makeStyles({
     borderRadius: '4px',
   },
   lightThemeFontColor: {
-    color: '#155084'
+    color: '#155084',
+    '& .MuiInputBase-root': {
+      color: 'rgba (0, 0, 0, 0.54)',
+    }
   },
   darkThemeFontColor: {
-    color: '#ffffff'
+    color: '#ffffff',
+    '& .MuiInputBase-root': {
+      color: '#fff',
+    }
   },
   errorMessage: {
     fontSize:"11px", 
diff --git a/app/src/components/right/ComponentDrag.tsx b/app/src/components/right/ComponentDrag.tsx
index 777c68849..60fda99da 100644
--- a/app/src/components/right/ComponentDrag.tsx
+++ b/app/src/components/right/ComponentDrag.tsx
@@ -34,6 +34,7 @@ const ComponentDrag = ({isThemeLight}): JSX.Element => {
                   name={comp.name}
                   id={comp.id}
                   root={true}
+                  isThemeLight={isThemeLight}
                   />
                
               );
diff --git a/app/src/components/right/ComponentPanel.tsx b/app/src/components/right/ComponentPanel.tsx
index 0b3750665..e30beb2d5 100644
--- a/app/src/components/right/ComponentPanel.tsx
+++ b/app/src/components/right/ComponentPanel.tsx
@@ -261,10 +261,16 @@ const useStyles = makeStyles({
     fontSize: '0.85rem'
   },
   lightThemeFontColor: {
-    color: '#155084'
+    color: '#155084',
+    '& .MuiInputBase-root': {
+      color: 'rgba (0, 0, 0, 0.54)',
+    }
   },
   darkThemeFontColor: {
-    color: '#fff'
+    color: '#fff',
+    '& .MuiInputBase-root': {
+      color: '#fff',
+    }
   }
 });
 
diff --git a/app/src/components/right/ComponentPanelItem.tsx b/app/src/components/right/ComponentPanelItem.tsx
index 410ff224f..c291c0739 100644
--- a/app/src/components/right/ComponentPanelItem.tsx
+++ b/app/src/components/right/ComponentPanelItem.tsx
@@ -41,7 +41,8 @@ const ComponentPanelItem: React.FC<{
   id: number;
   root: boolean;
   isFocus: boolean;
-}> = ({ name, id, root, isFocus }) => {
+  isThemeLight: boolean;
+}> = ({ name, id, root, isFocus, isThemeLight }) => {
   const classes = useStyles();
   const [state, dispatch] = useContext(StateContext);
 
@@ -66,6 +67,7 @@ const ComponentPanelItem: React.FC<{
       payload: { componentId: id, childId: null }
     });
   };
+  console.log('isThemeLight 3:',isThemeLight)
   return (
     <Grid
       item
@@ -73,8 +75,7 @@ const ComponentPanelItem: React.FC<{
       xs={8}
       style={{
         display: 'grid',
-        color: '#262626',
-        display: 'grid',
+        color: isThemeLight ? 'black' : 'white',
         backgroundColor: 'transparent',
         border: root
           ? '2px dotted #186BB4'
@@ -86,7 +87,7 @@ const ComponentPanelItem: React.FC<{
     >
       {isFocus && <div className={classes.focusMark}></div>}  
       <div className="compPanelItem" onClick={handleClick}>
-        <h3 >{name}</h3>
+        <h3>{name}</h3>
       </div>
     </Grid>
   );
@@ -102,6 +103,12 @@ const useStyles = makeStyles({
     width: '12px',
     height: '12px',
     borderRadius: '25px',
+  },
+  lightTheme: {
+    color: 'rgba (0, 0, 0, 0.54)'
+  },
+  darkTheme: {
+    color: '#fff'
   }
 });
 
diff --git a/app/src/components/right/StatePropsPanel.tsx b/app/src/components/right/StatePropsPanel.tsx
index 01b4416bd..8efc8a4a8 100644
--- a/app/src/components/right/StatePropsPanel.tsx
+++ b/app/src/components/right/StatePropsPanel.tsx
@@ -130,15 +130,15 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
             variant="outlined"
             value={inputKey}
             onChange={(e) => setInputKey(e.target.value)}
-            className={isThemeLight ? classes.rootLight : classes.rootDark} 
+            className={isThemeLight ? `${classes.rootLight} ${classes.inputTextLight}` : `${classes.rootDark} ${classes.inputTextDark}`} 
             />
           <TextField
             id="textfield-value"
-            className={isThemeLight ? classes.rootLight : classes.rootDark} 
             label="value:"
             variant="outlined"
             value={inputValue}
             onChange={(e) => setInputValue(e.target.value)}
+            className={isThemeLight ? `${classes.rootLight} ${classes.inputTextLight}` : `${classes.rootDark} ${classes.inputTextDark}`} 
             />
           <FormControl required className={isThemeLight ? `${classes.formControl} ${classes.lightThemeFontColor}` : `${classes.formControl} ${classes.darkThemeFontColor}`}>
             <InputLabel 
@@ -149,7 +149,7 @@ const StatePropsPanel = ({ isThemeLight }): JSX.Element => {
             <Select
               labelId="select-required-label"
               id="type-input"
-              className={isThemeLight ? `${classes.selectEmpty} ${classes.rootUnderlineLight}` : `${classes.selectEmpty} ${classes.rootUnderlineDark}`}
+              className={isThemeLight ? `${classes.selectEmpty} ${classes.rootUnderlineLight} ${classes.inputTextLight}` : `${classes.selectEmpty} ${classes.rootUnderlineDark} ${classes.inputTextDark}`}
               value={inputType}
               onChange={(event, index) => setInputType(index.props.value)}
             >
@@ -351,6 +351,16 @@ const useStyles = makeStyles((theme: Theme) =>
           borderBottom: '1px solid rgba(0,0,0,0.54)'
         }
       // }
+    },
+    inputTextDark: {
+      '& .MuiInputBase-input': {
+        color: 'white'
+      }
+    },
+    inputTextLight: {
+      '& .MuiInputBase-input': {
+        color: 'rgba(0,0,0,0.54)'
+      }
     }
   })
 );
diff --git a/app/src/components/right/TableStateProps.tsx b/app/src/components/right/TableStateProps.tsx
index 93f677672..51da26f63 100644
--- a/app/src/components/right/TableStateProps.tsx
+++ b/app/src/components/right/TableStateProps.tsx
@@ -18,35 +18,30 @@ const getColumns = (props) => {
     {
       field: 'id',
       headerName: 'ID',
-      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 70,
       editable: false,
     },
     {
       field: 'key',
       headerName: 'Key',
-      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 90,
       editable: true,
     },
     {
       field: 'value',
       headerName: 'Value',
-      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 90,
       editable: true,
     },
     {
       field: 'type',
       headerName: 'Type',
-      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 90,
       editable: false,
     },
     {
       field: 'delete',
       headerName: 'X',
-      headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
       width: 70,
       editable: false,
       renderCell: function renderCell(params:any) {
@@ -100,8 +95,7 @@ const TableStateProps = (props) => {
         pageSize={5}
         editRowsModel={editRowsModel}
         onRowClick = {selectHandler}
-        headerClassName: props.isThemeLight ? 'classes.themeLight' : 'classes.themeDark',
-
+        className={props.isThemeLight ? classes.themeLight : classes.themeDark}
       />
     </div>
   );
@@ -110,10 +104,25 @@ const TableStateProps = (props) => {
 
 const useStyles = makeStyles({
   themeLight: {
-    color: 'rbga(0,0,0,054)'
+    color: 'rgba(0,0,0,0.54)',
+    '& .MuiTablePagination-root': {
+      color: 'rbga(0,0,0,0.54)'
+    },
   },
   themeDark: {
-    color: 'white'
+    color: 'white',
+    '& .MuiTablePagination-root': {
+      color: 'white'
+    },
+    '& .MuiIconButton-root': {
+      color: 'white'
+    },
+    '& .MuiSvgIcon-root': {
+      color: 'white'
+    },
+    '& .MuiDataGrid-window': {
+      backgroundColor: 'rgba(0,0,0,0.54)'
+    }
   }
 });
 

From f7228900da8485c3c3e1e4e6033656433ce7c8e8 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Tue, 21 Sep 2021 16:41:48 -0700
Subject: [PATCH 19/22] cleaned up code for merging with dev branch,
 Co-authored-by: Philip Hua <philiphuahhhh@gmail.com> Co-authored-by: Miles
 Wright <mileswright818@gmail.com> Co-authored-by: William Rittwage 
 <wbrittwage@protonmail.com> Co-authored-by: Daniel Reilley
 <dannyreilley@gmail.com>

---
 app/src/components/login/SignUp.tsx           |  2 +-
 .../components/right/ComponentPanelItem.tsx   |  1 -
 app/src/components/right/StatePropsPanel.tsx  | 21 +++++++------------
 app/src/containers/CustomizationPanel.tsx     |  9 --------
 package.json                                  |  1 -
 5 files changed, 9 insertions(+), 25 deletions(-)

diff --git a/app/src/components/login/SignUp.tsx b/app/src/components/login/SignUp.tsx
index fc7e7e852..720946251 100644
--- a/app/src/components/login/SignUp.tsx
+++ b/app/src/components/login/SignUp.tsx
@@ -281,7 +281,7 @@ const SignUp: React.FC<LoginInt & RouteComponentProps> = props => {
             onClick={e => handleSignUp(e)}
           >
             Sign Up
-          </Button>+
+          </Button>
           <Grid container justify="flex-end">
             <Grid item>
               <RouteLink to={`/login`} className="nav_link">
diff --git a/app/src/components/right/ComponentPanelItem.tsx b/app/src/components/right/ComponentPanelItem.tsx
index c291c0739..e4994ab18 100644
--- a/app/src/components/right/ComponentPanelItem.tsx
+++ b/app/src/components/right/ComponentPanelItem.tsx
@@ -67,7 +67,6 @@ const ComponentPanelItem: React.FC<{
       payload: { componentId: id, childId: null }
     });
   };
-  console.log('isThemeLight 3:',isThemeLight)
   return (
     <Grid
       item
diff --git a/app/src/components/right/StatePropsPanel.tsx b/app/src/components/right/StatePropsPanel.tsx
index 8efc8a4a8..bfcf20d82 100644
--- a/app/src/components/right/StatePropsPanel.tsx
+++ b/app/src/components/right/StatePropsPanel.tsx
@@ -329,28 +329,23 @@ const useStyles = makeStyles((theme: Theme) =>
       }
     },
     underlineDark: {
-        borderBottom: '1px solid white'
-      
+      borderBottom: '1px solid white'
     },
     rootUnderlineDark: {
       '& .MuiSelect-icon': {
         color: '#fff',
       },
-      // '& .MuiInput-underline': {
-        '&::before': {
-          borderBottom: '1px solid #fff'
-        }
-      // }
+      '&::before': {
+        borderBottom: '1px solid #fff'
+      }
     },
-        rootUnderlineLight: {
+    rootUnderlineLight: {
       '& .MuiSelect-icon': {
         color: 'rgba(0,0,0,0.54)',
       },
-      // '& .MuiInput-underline': {
-        '&::before': {
-          borderBottom: '1px solid rgba(0,0,0,0.54)'
-        }
-      // }
+      '&::before': {
+        borderBottom: '1px solid rgba(0,0,0,0.54)'
+      }
     },
     inputTextDark: {
       '& .MuiInputBase-input': {
diff --git a/app/src/containers/CustomizationPanel.tsx b/app/src/containers/CustomizationPanel.tsx
index 2598df41b..eab20b9fd 100644
--- a/app/src/containers/CustomizationPanel.tsx
+++ b/app/src/containers/CustomizationPanel.tsx
@@ -735,15 +735,6 @@ const useStyles = makeStyles({
       border: isThemeLight ? '1px solid #808080' : '1px solid #ECECEA'
     }
   }),
-  // buttonRow: {
-  //   textAlign: 'center',
-  //   marginTop: '25px',
-  //   '& .MuiButton-textSecondary': {
-  //     color: '#808080', // color for delete page
-  //     border: '1px solid #808080' 
-  //   }
-  // },
-
   button: {
     fontSize: '1rem',
     paddingLeft: '20px',
diff --git a/package.json b/package.json
index e91b63c0c..449fa41f1 100644
--- a/package.json
+++ b/package.json
@@ -134,7 +134,6 @@
     "dotenv": "^8.2.0",
     "electron-debug": "^3.1.0",
     "electron-devtools-installer": "^2.2.4",
-    "electron-oauth2": "^3.0.0",
     "electron-splashscreen": "^1.0.0",
     "electron-window-manager": "^1.0.6",
     "enzyme": "^3.4.1",

From aa74e204e2f23e3e7981a8a5500d5d27a25060f1 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Wed, 22 Sep 2021 15:52:16 -0700
Subject: [PATCH 20/22] cleaned up oauth branch, Co-authored-by: Philip Hua
 <philiphuahhhh@gmail.com> Co-authored-by: Miles Wright
 <mileswright818@gmail.com> Co-authored-by: William Rittwage 
 <wbrittwage@protonmail.com> Co-authored-by: Daniel Reilley
 <dannyreilley@gmail.com>

---
 app/electron/main.js                         |  6 +++---
 app/src/components/right/TableStateProps.tsx |  2 --
 app/src/helperFunctions/gitHubOauth.ts       |  1 -
 app/src/utils/createApplication.util.ts      |  1 -
 app/src/utils/createGatsbyApp.util.ts        |  3 ---
 app/src/utils/createNextApp.util.ts          |  3 ---
 server/controllers/sessionController.js      | 12 +-----------
 server/controllers/userController.js         |  1 -
 server/package.json                          |  2 +-
 server/server.js                             |  1 +
 10 files changed, 6 insertions(+), 26 deletions(-)

diff --git a/app/electron/main.js b/app/electron/main.js
index bfd975d8c..8c0468f78 100644
--- a/app/electron/main.js
+++ b/app/electron/main.js
@@ -204,6 +204,8 @@ app.on('ready', createWindow);
 
 // Quit when all windows are closed.
 app.on('window-all-closed', () => {
+  require('electron').app.getPath('userData');
+  win.webContents.executeJavaScript('window.localStorage.clear();');
   app.quit();
 });
 
@@ -258,7 +260,6 @@ app.on('web-contents-created', (event, contents) => {
       'https://www.html5rocks.com',
       'app://rse/'
     ];
-
     // Log and prevent the app from redirecting to a new page
     if (
       !validOrigins.includes(parsedUrl.origin)
@@ -368,7 +369,6 @@ ipcMain.on('set_cookie', event => {
       // this if statement is necessary or the setInterval on main app will constantly run and will emit this event.reply, causing a memory leak
       // checking for a cookie inside array will only emit reply when a cookie exists
       if (cookie[0]) {
-        //console.log(cookie);
         event.reply('give_cookie', cookie);
       }
     })
@@ -466,7 +466,7 @@ ipcMain.on('github', event => {
       github.close();
       win.webContents
         .executeJavaScript(`window.localStorage.setItem('ssid', '${ssid}')`)
-        .then(result => win.loadURL(`app://rse?=${ssid}`))
+        .then(result => win.loadURL(`${redirectUrl}`))
         .catch(err => console.log(err));
     }
   });
diff --git a/app/src/components/right/TableStateProps.tsx b/app/src/components/right/TableStateProps.tsx
index 51da26f63..746a84bd3 100644
--- a/app/src/components/right/TableStateProps.tsx
+++ b/app/src/components/right/TableStateProps.tsx
@@ -13,7 +13,6 @@ import { StatePropsPanelProps } from '../../interfaces/Interfaces';
 
 const getColumns = (props) => {
   const { deleteHandler } : StatePropsPanelProps = props;
-  console.log('isThemeLight: ',props.isThemeLight)
   return [
     {
       field: 'id',
@@ -71,7 +70,6 @@ const TableStateProps = (props) => {
   
 
   useEffect(() => {
-  console.log('isThemeLight: ',props.isThemeLight)
     setGridColumns(getColumns(props));
   }, [props.isThemeLight])
   // get currentComponent by using currently focused component's id
diff --git a/app/src/helperFunctions/gitHubOauth.ts b/app/src/helperFunctions/gitHubOauth.ts
index 9d6d44655..5eeaa0fe1 100644
--- a/app/src/helperFunctions/gitHubOauth.ts
+++ b/app/src/helperFunctions/gitHubOauth.ts
@@ -1,5 +1,4 @@
 const handleGitHubOauth = () => {
-  console.log('git hub');
   const gitHubUrl = 'https://github.com/login/oauth/authorize?';
   const authUrl =
   `${gitHubUrl}client_id=`;
diff --git a/app/src/utils/createApplication.util.ts b/app/src/utils/createApplication.util.ts
index df9efda7c..95955a974 100644
--- a/app/src/utils/createApplication.util.ts
+++ b/app/src/utils/createApplication.util.ts
@@ -346,7 +346,6 @@ async function createApplicationUtil({
   appName: string;
   components: Component[];
 }) {
-  console.log('in the createApplication util');
 
   await createIndexHtml(path, appName);
   await createIndexTsx(path, appName);
diff --git a/app/src/utils/createGatsbyApp.util.ts b/app/src/utils/createGatsbyApp.util.ts
index 32d54df28..9e9e93035 100644
--- a/app/src/utils/createGatsbyApp.util.ts
+++ b/app/src/utils/createGatsbyApp.util.ts
@@ -147,14 +147,11 @@ async function createGatsbyAppUtil({
   components: Component[];
   rootComponents: number[];
 }) {
-  console.log('in the createGatsbyApplication util');
-
   await initFolders(path, appName);
   await createBaseTsx(path, appName);
   await createDefaultCSS(path, appName, components);
   await createPackage(path, appName);
   await createTsConfig(path, appName);
   await createGatsbyFiles(components, path, appName, rootComponents);
-
 }
 export default createGatsbyAppUtil;
diff --git a/app/src/utils/createNextApp.util.ts b/app/src/utils/createNextApp.util.ts
index 1f06edfd4..be96f5990 100644
--- a/app/src/utils/createNextApp.util.ts
+++ b/app/src/utils/createNextApp.util.ts
@@ -146,14 +146,11 @@ async function createNextAppUtil({
   components: Component[];
   rootComponents: number[];
 }) {
-  console.log('in the createNextApplication util');
-
   await initFolders(path, appName);
   await createBaseTsx(path, appName);
   await createDefaultCSS(path, appName, components);
   await createPackage(path, appName);
   await createTsConfig(path, appName);
   await createNextFiles(components, path, appName, rootComponents);
-
 }
 export default createNextAppUtil;
diff --git a/server/controllers/sessionController.js b/server/controllers/sessionController.js
index 87f679e9b..9cd71679b 100644
--- a/server/controllers/sessionController.js
+++ b/server/controllers/sessionController.js
@@ -40,7 +40,7 @@ sessionController.startSession = (req, res, next) => {
         log: `Error in sessionController.startSession find session: ${err}`,
         message: {
           err:
-            'Error in sessionController.startSession find session, check server logs for details'
+          'Error in sessionController.startSession find session, check server logs for details'
         }
       });
       // if session doesn't exist, create a session
@@ -69,19 +69,13 @@ sessionController.startSession = (req, res, next) => {
 };
 
 sessionController.gitHubResponse = (req, res, next) => {
-  console.log('hi')
   const { code } = req.query;
-  console.log('code:',code)
-  console.log('code =>', code);
-  console.log('JSON:', )
-  console.log(process.env.GITHUB_ID)
   if (!code)
     return next({
       log: 'Undefined or no code received from github.com',
       message: 'Undefined or no code received from github.com',
       status: 400
     });
-    console.log('heyyyy');
     fetch(`https://github.com/login/oauth/access_token?client_id=${process.env.GITHUB_ID}&client_secret=${process.env.GITHUB_SECRET}&code=${code}`, {
       method: 'POST',
       headers: {
@@ -96,13 +90,10 @@ sessionController.gitHubResponse = (req, res, next) => {
     })
       .then(res => res.json())
       .then(token => {
-        console.log('hi');
-        console.log('token: ',token['access_token'] )
         res.locals.token = token['access_token'];
         return next();
       })
       .catch(err => {
-        console.log('hi');
         res.status(500).json({ message: `${err.message} in gitHubResponse` })
       }
       );
@@ -120,7 +111,6 @@ sessionController.gitHubSendToken = (req, res, next) => {
   })
     .then(res => res.json())
     .then(data => {
-      console.log('this is data:', data);
       res.locals.githubEmail = data[0]['email'];
       res.locals.signUpType = 'oauth';
       return next();
diff --git a/server/controllers/userController.js b/server/controllers/userController.js
index 8b15ed644..812a1f8ad 100644
--- a/server/controllers/userController.js
+++ b/server/controllers/userController.js
@@ -85,7 +85,6 @@ userController.createUser = (req, res, next) => {
 userController.verifyUser = (req, res, next) => {
   let { username, password, isFbOauth } = req.body;
   // handle Oauth
-  console.log('We verifying');
   if (res.locals.signUpType === 'oauth') {
     username = res.locals.githubEmail;
     password = res.locals.githubPassword;
diff --git a/server/package.json b/server/package.json
index 59121fba4..ddd04d5a1 100644
--- a/server/package.json
+++ b/server/package.json
@@ -10,7 +10,7 @@
     "test": "jest --verbose ",
     "test:watch": "jest --watch",
     "start": "cross-env NODE_ENV=production node server.js",
-    "prod": "cross-env NODE_ENV=production node server.js",
+    "prod": "cross-env NODE_ENV=production nodemon server.js",
     "dev": "cross-env NODE_ENV=development nodemon server.js"
   },
   "keywords": [],
diff --git a/server/server.js b/server/server.js
index d0d645895..8183f5248 100644
--- a/server/server.js
+++ b/server/server.js
@@ -55,6 +55,7 @@ app.get(
     if (isDev) {
       return res.status(200).redirect(`http://localhost:8080?=${res.locals.ssid}`);
     } else {
+      console.log('res.locals.ssid: ',res.locals.ssid);
       return res.status(200).redirect(`app://rse?=${res.locals.ssid}`);
     }
   }

From 3d69158a6aa77a3d191cc3619953ab915c156656 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Wed, 22 Sep 2021 16:01:47 -0700
Subject: [PATCH 21/22] fixed customization tab color in light mode,
 Co-authored-by: Philip Hua <philiphuahhhh@gmail.com> Co-authored-by: Miles
 Wright <mileswright818@gmail.com> Co-authored-by: William Rittwage 
 <wbrittwage@protonmail.com> Co-authored-by: Daniel Reilley
 <dannyreilley@gmail.com>

---
 app/src/components/bottom/BottomTabs.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/src/components/bottom/BottomTabs.tsx b/app/src/components/bottom/BottomTabs.tsx
index 64bdbfde4..2d0f6057c 100644
--- a/app/src/components/bottom/BottomTabs.tsx
+++ b/app/src/components/bottom/BottomTabs.tsx
@@ -116,9 +116,9 @@ const useStyles = makeStyles(theme => ({
     boxShadow: '0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)',
     
   },
-  rootLight: isThemeLight => ({
-    backgroundColor: isThemeLight ? 'blue': 'red'
-  }),
+  rootLight: {
+    backgroundColor: '#003366'
+  },
   bottomHeader: {
     flex: 1,
     flexDirection: 'row',

From 18372cf0cef91526cdea15ac1687c158640a54b9 Mon Sep 17 00:00:00 2001
From: pmhua <philiphuahhhh@gmail.com>
Date: Wed, 22 Sep 2021 18:46:19 -0700
Subject: [PATCH 22/22] cleaned up testing branch (feature/checkbox), removed
 console logs Co-authored-by: Philip Hua <philiphuahhhh@gmail.com>
 Co-authored-by: Miles Wright <mileswright818@gmail.com> Co-authored-by:
 William Rittwage  <wbrittwage@protonmail.com> Co-authored-by: Daniel Reilley
 <dannyreilley@gmail.com>

---
 app/electron/main.js                         |  1 -
 app/src/components/right/ExportButton.tsx    |  1 -
 app/src/helperFunctions/generateCode.ts      |  2 +-
 app/src/utils/createApplication.util.ts      |  3 +--
 app/src/utils/createGatsbyApp.util.ts        |  3 ---
 app/src/utils/createNextApp.util.ts          |  1 -
 app/src/utils/createTestSuite.util.ts        | 27 +++++++++-----------
 app/src/utils/createTestSuiteClassic.util.ts |  6 -----
 app/src/utils/createTestSuiteNext.util.ts    | 10 --------
 server/graphQL/resolvers/query.js            |  2 --
 server/server.js                             |  1 -
 11 files changed, 14 insertions(+), 43 deletions(-)

diff --git a/app/electron/main.js b/app/electron/main.js
index 8c0468f78..88cf5e2b4 100644
--- a/app/electron/main.js
+++ b/app/electron/main.js
@@ -204,7 +204,6 @@ app.on('ready', createWindow);
 
 // Quit when all windows are closed.
 app.on('window-all-closed', () => {
-  require('electron').app.getPath('userData');
   win.webContents.executeJavaScript('window.localStorage.clear();');
   app.quit();
 });
diff --git a/app/src/components/right/ExportButton.tsx b/app/src/components/right/ExportButton.tsx
index 09f92467a..ebedab976 100644
--- a/app/src/components/right/ExportButton.tsx
+++ b/app/src/components/right/ExportButton.tsx
@@ -87,7 +87,6 @@ export default function ExportButton() {
     // when a directory is chosen, the callback will export the project to the chosen folder
     // Note: this listener is imported from the main process via preload.js
     window.api.addAppDirChosenListener(path => {
-      // console.log(testchecked);
       exportProject(
         path,
         state.name
diff --git a/app/src/helperFunctions/generateCode.ts b/app/src/helperFunctions/generateCode.ts
index 23aa4c89e..e1c7fe951 100644
--- a/app/src/helperFunctions/generateCode.ts
+++ b/app/src/helperFunctions/generateCode.ts
@@ -188,7 +188,7 @@ const generateUnformattedCode = (
           .join('\n')
       : imports
           .map((comp: string) => {
-            return `import ${comp} from './${comp}.tsx'`;
+            return `import ${comp} from './${comp}'`;
           })
           .join('\n');
 
diff --git a/app/src/utils/createApplication.util.ts b/app/src/utils/createApplication.util.ts
index 8c26c20ca..8a70addbe 100644
--- a/app/src/utils/createApplication.util.ts
+++ b/app/src/utils/createApplication.util.ts
@@ -376,8 +376,7 @@ async function createApplicationUtil({
   await createTsLint(path, appName);
   await createServer(path, appName);
   if (testchecked) {
-    console.log('entering createTestSuiteClassic');
-  await createTestSuiteClassic({path, appName, components, testchecked});
+    await createTestSuiteClassic({path, appName, components, testchecked});
   }
   await createFiles(components, path, appName, true);
 }
diff --git a/app/src/utils/createGatsbyApp.util.ts b/app/src/utils/createGatsbyApp.util.ts
index 47ee632c5..bab21770a 100644
--- a/app/src/utils/createGatsbyApp.util.ts
+++ b/app/src/utils/createGatsbyApp.util.ts
@@ -26,7 +26,6 @@ const compToCSS = (component: Component) => {
 
 //createPackage
 export const createPackage = (path, appName, test) => {
-  // console.log('in createpackage: ',test);
   const filePath = `${path}/${appName}/package.json`;
   
   let tsjest = `,
@@ -36,7 +35,6 @@ export const createPackage = (path, appName, test) => {
           "enzyme": "^3.11.0",
           "enzyme-adapter-react-16": "^1.15.6",
           "jest": "^27.2.0",
-          "react-test-renderer": "^17.0.2",
           "@types/react-dom": "^17.0.9",
           "@types/enzyme-adapter-react-16": "^1.0.6",
           "@types/react-test-renderer": "^17.0.1",
@@ -191,7 +189,6 @@ async function createGatsbyAppUtil({
   await createPackage(path, appName, testchecked);
   await createTsConfig(path, appName);
   if (testchecked) {
-    console.log('testchecked: ',testchecked);
     await createTestSuite({path, appName, components, rootComponents, testchecked});
   }
   await createGatsbyFiles(components, path, appName, rootComponents);
diff --git a/app/src/utils/createNextApp.util.ts b/app/src/utils/createNextApp.util.ts
index 42c69f43c..dd3e8b36f 100644
--- a/app/src/utils/createNextApp.util.ts
+++ b/app/src/utils/createNextApp.util.ts
@@ -212,7 +212,6 @@ async function createNextAppUtil({
   await createPackage(path, appName, testchecked);
   await createTsConfig(path, appName);
   if (testchecked) {
-    console.log('testchecked: ',testchecked);
     await createTestSuiteNext({path, appName, components, rootComponents, testchecked});
   }
   await createNextFiles(components, path, appName, rootComponents);
diff --git a/app/src/utils/createTestSuite.util.ts b/app/src/utils/createTestSuite.util.ts
index bd5777ab6..45b0b09dd 100644
--- a/app/src/utils/createTestSuite.util.ts
+++ b/app/src/utils/createTestSuite.util.ts
@@ -2,9 +2,6 @@
 // create config files
 // add webpack dependencies
 // create tests for components
-// const createTestSuite = () => {
-//   console.log('creating test suites');
-// }
 
 const initFolders = (path: string, appName: string) => {
   let dir = path;
@@ -120,12 +117,9 @@ async function createJestPreprocessFile(path: string, appName: string){
 
 async function createComponentTests(path: string, appName: string, components: Component[]) {
   const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
-  console.log(JSON.stringify(components))
-  console.log(components);
 
   let data:string = `
   import React from "react"
-  import renderer from "react-test-renderer"
   import Enzyme, { shallow } from 'enzyme';
 
 
@@ -135,9 +129,17 @@ async function createComponentTests(path: string, appName: string, components: C
 
   components.forEach(page => {
 
-    let importString = `
+    let importString = ''
+    if (page.isPage) {
+
+      importString = `
   import ${capitalize(page.name)} from "../src/pages/${page.name}";`;
-    data = data + importString;
+      data = data + importString;
+    } else {
+      importString = `
+  import ${capitalize(page.name)} from "../src/components/${page.name}";`;
+      data = data + importString;   
+    }
   })
 
   //let describe = `describe("${page.name}", () => {`
@@ -149,10 +151,8 @@ async function createComponentTests(path: string, appName: string, components: C
 
   data = data + `
     it("renders correctly", () => {
-      const tree = renderer
-          .create(<${capitalize(page.name)} />)
-          .toJSON()
-      expect(tree).toMatchSnapshot()
+      const tree = shallow(<${capitalize(page.name)} />);
+      expect(tree).toMatchSnapshot();
     })`
 
 
@@ -189,9 +189,6 @@ async function createTestSuite({
   rootComponents: number[];
   testchecked: boolean;
 }) {
-  console.log('in the createGatsbyApplication util');
-  console.log('testchecked: ', testchecked);
-
   await initFolders(path, appName);
   await createMocksFiles(path, appName);
   await createTestsFiles(path, appName);
diff --git a/app/src/utils/createTestSuiteClassic.util.ts b/app/src/utils/createTestSuiteClassic.util.ts
index a58a411dc..326a97baa 100644
--- a/app/src/utils/createTestSuiteClassic.util.ts
+++ b/app/src/utils/createTestSuiteClassic.util.ts
@@ -2,7 +2,6 @@
 
 
 const initFolders = (path: string, appName: string) => {
-  console.log(window); // remember to delete
   let dir = path;
   dir = `${dir}/${appName}`;
   if (!window.api.existsSync(`${dir}/__tests__`)) {
@@ -53,8 +52,6 @@ const createJestPreprocessFile = (path: string, appName: string) => {
 
 async function createComponentTests(path: string, appName: string, components: Component[]) {
     const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
-    console.log(JSON.stringify(components))
-    console.log(components);
   
     let data:string = `
     import { shallow } from 'enzyme'
@@ -146,9 +143,6 @@ async function createTestSuiteClassic({
   components: Component[];
   testchecked: boolean;
 }) {
-  console.log('in the createClassicApplication util');
-  console.log('testchecked: ', testchecked);
-
   await initFolders(path, appName);
   await createJestConfigFile(path, appName);
   await createJestPreprocessFile(path, appName);
diff --git a/app/src/utils/createTestSuiteNext.util.ts b/app/src/utils/createTestSuiteNext.util.ts
index 48eb8ae00..6342aaa7f 100644
--- a/app/src/utils/createTestSuiteNext.util.ts
+++ b/app/src/utils/createTestSuiteNext.util.ts
@@ -59,7 +59,6 @@ module.exports = {
 };
 
 async function createJestTsconfigJsonFile(path: String, appName: String){
-  console.log('got in create jest tsconfig');
   const filePath:string = `${path}/${appName}/jest.tsconfig.json`;
   const data:string = `
 {
@@ -88,7 +87,6 @@ async function createJestTsconfigJsonFile(path: String, appName: String){
   ]
 }
 `;
-  console.log(data);
   window.api.writeFile(filePath, data, err => {
     if (err) {
       console.log('createTestSuiteNext.util createJestTsconfigJsonFile error:', err.message);
@@ -133,8 +131,6 @@ require('enzyme').configure({adapter: new Adapter()});`;
 
 async function createComponentTests(path: string, appName: string, components: Component[]) {
   const filePath: string = `${path}/${appName}/__tests__/test.tsx`;
-  console.log(JSON.stringify(components))
-  console.log(components);
 
   let data:string = `
   import { shallow } from 'enzyme'
@@ -142,7 +138,6 @@ async function createComponentTests(path: string, appName: string, components: C
   `;
 
   components.forEach(page => {
-    console.log(page);
     let importString = '';
     if (page.isPage) {
       importString = `
@@ -202,12 +197,7 @@ async function createTestSuite({
   rootComponents: number[];
   testchecked: boolean;
 }) {
-  console.log('in the createGatsbyApplication util');
-  console.log('testchecked: ', testchecked);
-
   await initFolders(path, appName);
-  // await createMocksFiles(path, appName);
-  // await createTestsFiles(path, appName);
   await createJestConfigFile(path, appName);
   await createJestTsconfigJsonFile(path, appName);
   await createJestPreprocessFile(path, appName);
diff --git a/server/graphQL/resolvers/query.js b/server/graphQL/resolvers/query.js
index a2041c209..3d7f6450a 100644
--- a/server/graphQL/resolvers/query.js
+++ b/server/graphQL/resolvers/query.js
@@ -7,7 +7,6 @@ const { Projects, Comments } = require('../../models/reactypeModels');
 const Project = {
   getProject: async (parent, { projId }) => {
     const resp = await Projects.findOne({ _id: projId });
-    // console.log('getProject return >>> ', resp);
     if (resp) {
       return ({
         name: resp.name,
@@ -29,7 +28,6 @@ const Project = {
 
   getAllProjects: async (parent, { userId }) => {
     let resp = await Projects.find({});
-    // console.log('getAllProjects resp >>> ', resp);
     if (userId) {
       // use loosely equal for the callback because there are some discrepancy between the type of userId from the db vs from the mutation query
       resp = resp.filter(proj => proj.userId == userId);
diff --git a/server/server.js b/server/server.js
index 8183f5248..d0d645895 100644
--- a/server/server.js
+++ b/server/server.js
@@ -55,7 +55,6 @@ app.get(
     if (isDev) {
       return res.status(200).redirect(`http://localhost:8080?=${res.locals.ssid}`);
     } else {
-      console.log('res.locals.ssid: ',res.locals.ssid);
       return res.status(200).redirect(`app://rse?=${res.locals.ssid}`);
     }
   }