Merged login/signup flow from master

Author: tsully

.babelrc

@@ -7,12 +7,12 @@
       }
     ],
     "react",
-    "stage-0",
+    "stage-0"
   ],
   "plugins": ["transform-es2015-modules-commonjs"],
   "env": {
     "test": {
       "plugins": ["transform-es2015-modules-commonjs"]
     }
-}
+  }
 }

main.js

@@ -4,19 +4,19 @@ const { initSplashScreen, OfficeTemplate } = require('electron-splashscreen');
 //path resolver dependency for splash screen
 const { resolve } = require('app-root-path');
 
-
 const {
   app,
   BrowserWindow,
   Menu,
   shell,
   dialog,
   ipcMain,
-  globalShortcut
+  globalShortcut,
+  session
 } = require('electron');
 
 // Uncomment below for hot reloading during development
-// require('electron-reload')(__dirname);
+require('electron-reload')(__dirname);
 
 // const isDev = true;
 const isDev =
@@ -119,7 +119,8 @@ const createWindow = () => {
   });
 
   // and load the index.html of the app.
-  mainWindow.loadURL(`file://${__dirname}/build/index.html`);
+  // now loading what the server serves, this url will need to change when/if we decide to put reactype on the web
+  mainWindow.loadURL(`http://localhost:8080`);
   // load page once window is loaded
   mainWindow.once('ready-to-show', () => {
     mainWindow.show();
@@ -265,9 +266,9 @@ const createWindow = () => {
 
   // UNCOMMENT THIS DURING DEVELOPMENT TO ENABLE CONSOLE TO OPEN UPON LAUNCH
   // dev tools opened on every browser creation
-  // mainWindow.webContents.once('dom-ready', () => {
-  //   mainWindow.webContents.openDevTools();
-  // });
+  mainWindow.webContents.once('dom-ready', () => {
+    mainWindow.webContents.openDevTools();
+  });
 };
 
 // This method will be called when Electron has finished

package.json

@@ -75,7 +75,8 @@
     "test:update-snap": "cross-env NODE_ENV=test jest --updateSnapshot",
     "test:clear": "cross-env NODE_ENV=test jest --clearCache",
     "linter": "eslint src",
-    "develop": "concurrently \"npm run dev\" \"npm run electron\""
+    "develop": "concurrently \"npm run dev\" \"npm run electron\"",
+    "server": "cross-env NODE_ENV=development nodemon server/server.js"
   },
   "bin": {
     "reactype": "./index.js"
@@ -116,15 +117,19 @@
     "@types/react": "^16.8.14",
     "@types/react-dom": "^16.8.4",
     "@types/react-redux": "^7.0.8",
+    "@types/react-router-dom": "^5.1.5",
     "@types/react-syntax-highlighter": "^11.0.4",
     "ace-builds": "^1.4.8",
     "app-root-path": "^3.0.0",
     "autoprefixer": "^9.0.1",
     "babel-polyfill": "^6.26.0",
+    "bcryptjs": "^2.4.3",
+    "body-parser": "^1.19.0",
     "classnames": "^2.2.6",
     "cli-spinner": "^0.2.8",
     "commander": "^2.17.1",
     "concurrently": "^5.1.0",
+    "cookie-parser": "^1.4.5",
     "core-js": "^3.6.4",
     "csstype": "^2.6.9",
     "d3": "^5.9.2",
@@ -147,7 +152,8 @@
     "react-dom": "^16.4.1",
     "react-draggable": "^3.0.5",
     "react-konva": "^16.12.0-0",
-    "react-redux": "^5.0.7",
+    "react-redux": "^7.2.0",
+    "react-router-dom": "^5.2.0",
     "react-simple-code-editor": "^0.11.0",
     "react-sortable-tree": "^2.2.0",
     "react-syntax-highlighter": "^10.2.1",
@@ -175,6 +181,7 @@
     "copy-webpack-plugin": "^4.5.2",
     "cross-env": "^5.2.1",
     "css-loader": "^2.1.1",
+    "dotenv": "^8.2.0",
     "electron": "^2.0.7",
     "electron-builder": "^20.44.4",
     "electron-devtools-installer": "^2.2.4",
@@ -186,11 +193,15 @@
     "eslint-plugin-jest": "^21.21.0",
     "eslint-plugin-jsx-a11y": "^6.1.1",
     "eslint-plugin-react": "^7.10.0",
+    "express": "^4.17.1",
     "extract-text-webpack-plugin": "^4.0.0-beta.0",
     "html-webpack-plugin": "^3.1.0",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^25.2.6",
+    "mongodb": "^3.5.9",
+    "mongoose": "^5.9.20",
     "node-sass": "^4.13.1",
+    "nodemon": "^2.0.4",
     "postcss-loader": "^2.1.6",
     "redux-mock-store": "^1.5.4",
     "sass-loader": "^7.0.3",

server/controllers/cookieController.js

@@ -0,0 +1,11 @@
+const cookieController = {};
+
+// setSSIDCookie - store the user id from database in cookie
+cookieController.setSSIDCookie = (req, res, next) => {
+  // set cookie with key 'ssid' and value to user's id, also set http only
+  res.cookie('ssid', res.locals.id, { maxAge: 3600000 });
+  console.log('Successful setSSIDCookie');
+  return next();
+};
+
+module.exports = cookieController;

server/controllers/sessionController.js

@@ -0,0 +1,62 @@
+const Session = require('../models/sessionModel');
+const sessionController = {};
+
+// isLoggedIn finds appropriate session for this request in database, then verifies whether or not the session is still valid
+sessionController.isLoggedIn = (req, res, next) => {
+  // find session from request session ID in mongodb
+  Session.findOne({ cookieId: req.cookies.ssid }, (err, session) => {
+    if (err) {
+      return next({
+        log: `Error in sessionController.isLoggedIn: ${err}`,
+        message: {
+          err: `Error in sessionController.isLoggedIn, check server logs for details`
+        }
+      });
+      // no session found, redirect to signup page
+    } else if (!session) {
+      return res.redirect('/signup');
+    } else {
+      // session found, move onto next middleware
+      return next();
+    }
+  });
+};
+
+// startSession - create and save a new session into the database
+sessionController.startSession = (req, res, next) => {
+  console.log('Inside startSession');
+  // first check if user is logged in already
+  Session.findOne({ cookieId: res.locals.id }, (err, session) => {
+    if (err) {
+      return next({
+        log: `Error in sessionController.startSession find session: ${err}`,
+        message: {
+          err: `Error in sessionController.startSession find session, check server logs for details`
+        }
+      });
+      // if session doesn't exist, create a session
+      // if valid user logged in/signed up, res.locals.id should be user's id generated from mongodb, which we will set as this session's cookieId
+    } else if (!session) {
+      Session.create({ cookieId: res.locals.id }, (err, session) => {
+        if (err) {
+          return next({
+            log: `Error in sessionController.startSession create session: ${err}`,
+            message: {
+              err: `Error in sessionController.startSession create session, check server logs for details`
+            }
+          });
+        } else {
+          console.log('Successful startSession');
+          res.locals.ssid = session.id;
+          return next();
+        }
+      });
+      // if session exists, move onto next middleware
+    } else {
+      console.log('Session exists, moving on');
+      res.locals.ssid = session.id;
+      return next();
+    }
+  });
+};
+module.exports = sessionController;

server/controllers/userController.js

@@ -0,0 +1,76 @@
+// middleware functions create a new user and verify users
+
+const Users = require('../models/userModel');
+
+const userController = {};
+const bcrypt = require('bcryptjs');
+
+userController.createUser = (req, res, next) => {
+  console.log('Creating user...');
+  const { username, password } = req.body;
+  // error handling if username or password is missing
+  if (!username) {
+    return res.status(400).json('No username input');
+  }
+  if (!password) {
+    return res.status(400).json('No password input');
+  }
+  const projects = [];
+  // create user using username and password
+  Users.create({ username, password, projects }, (err, newUser) => {
+    if (err) {
+      return next({
+        log: `Error in userController.createUser: ${err}`,
+        message: {
+          err: `Error in userController.createUser. Check server logs for details`
+        }
+      });
+    } else {
+      // this id property will be used in other middleware for cookie
+      console.log('Successful createUser');
+      res.locals.id = newUser.id;
+      return next();
+    }
+  });
+};
+
+// verifyUser - Obtain username and password from the request body, locate
+// the appropriate user in the database, and then authenticate the submitted password against the password stored in the database.
+
+userController.verifyUser = (req, res, next) => {
+  console.log('Verifying user...');
+  const { username, password } = req.body;
+  if (!username) {
+    return res.status(400).json('No username input');
+  }
+  if (!password) {
+    return res.status(400).json('No password input');
+  }
+  Users.findOne({ username }, (err, user) => {
+    if (err) {
+      return next({
+        log: `Error in userController.verifyUser: ${err}`,
+        message: {
+          err: `Error in userController.verifyUser, check server logs for details`
+        }
+      });
+    } else if (user) {
+      // bcrypt compare function checks input password against hashed password
+      bcrypt.compare(password, user.password).then(isMatch => {
+        if (isMatch) {
+          // if password matches, save user id for following middleware
+          console.log('Successful verifyUser');
+          res.locals.id = user.id;
+          return next();
+        } else {
+          // if password does not match, redirect to ?
+          return res.status(400).json('Incorrect password');
+        }
+      });
+    } else {
+      return res.status(400).json('No such user found');
+    }
+  });
+};
+
+module.exports = userController;

server/models/sessionModel.js

@@ -0,0 +1,10 @@
+const mongoose = require('mongoose');
+const Schema = mongoose.Schema;
+
+// Mongo has an automatic document expiration service that we can use via the 'expires' property in the schema. This sets it so each session can only last an hour
+const sessionSchema = new Schema({
+  cookieId: { type: String, required: true, unique: true },
+  createdAt: { type: Date, expires: 3600, default: Date.now }
+});
+
+module.exports = mongoose.model('Sessions', sessionSchema);

server/models/userModel.js

@@ -0,0 +1,35 @@
+const mongoose = require('mongoose');
+require('dotenv').config();
+
+const Schema = mongoose.Schema;
+
+const userSchema = new Schema({
+  username: { type: String, required: true, unique: true },
+  password: { type: String, required: true },
+  projects: Array
+});
+
+// salt will go through 10 rounds of hashing
+const SALT_WORK_FACTOR = 10;
+const bcrypt = require('bcryptjs');
+const { session } = require('electron');
+
+// mongoose middleware that will run before the save to collection happens (user gets put into database)
+// cannot use arrow function here as context of 'this' is important
+userSchema.pre('save', function(next) {
+  // within this context, 'this' refers to the document (new user) about to be saved, in our case, it should have properties username, password, and projects array
+  bcrypt.hash(this.password, SALT_WORK_FACTOR, (err, hash) => {
+    if (err) {
+      return next({
+        log: `bcrypt password hashing error: ${err}`,
+        message: {
+          err: `bcrypt hash error: check server logs for details`
+        }
+      });
+    }
+    this.password = hash;
+    return next();
+  });
+});
+
+module.exports = mongoose.model('Users', userSchema);