Revamp eLecture

app/App.jsx

@@ -1,37 +1,37 @@
-import React, { Component } from 'react';
-import ReactDOM from 'react-dom';
-import { Provider } from 'react-redux';
-import { Router } from 'react-router';
-import { compose, createStore, applyMiddleware } from 'redux';
-import { persistStore, autoRehydrate } from 'redux-persist';
-import { createLogger } from 'redux-logger';
-import { createBrowserHistory } from 'history';
+import React, { PureComponent } from "react";
+import ReactDOM from "react-dom";
+import { Router } from "react-router";
+import { Provider } from "react-redux";
+import { createLogger } from "redux-logger";
+import { createBrowserHistory } from "history";
+import { persistStore, autoRehydrate } from "redux-persist";
+import { compose, createStore, applyMiddleware } from "redux";
 
-import Routes from './Routes';
+import Routes from "./Routes";
 
-import rootReducer from './reducers/app';
-import promise from './api/promise';
+import promise from "./api/promise";
+import rootReducer from "./reducers/app";
 
-import '../public/assets/css/app.css';
+import "../public/assets/css/app.css";
 
-class App extends Component {
+class App extends PureComponent {
 
     constructor(props) {
         super(props);
 
         const browserHistory = createBrowserHistory();
         const middleware = [
             promise,
-            process.env.NODE_ENV === 'development' && createLogger()
+            process.env.NODE_ENV === "development" && createLogger()
         ].filter(Boolean);
         const store = createStore(rootReducer, compose(applyMiddleware(...middleware), autoRehydrate()));
 
-        this.state = {browserHistory: browserHistory, store: store, rehydrated: false};
+        this.state = { browserHistory: browserHistory, store: store, rehydrated: false };
     }
 
     componentWillMount(){
         persistStore(this.state.store, {}, () => {
-            this.setState({rehydrated: true});
+            this.setState({ rehydrated: true });
         });
     }
 
@@ -52,4 +52,4 @@ class App extends Component {
 
 }
 
-ReactDOM.render(<App/>, document.getElementById('app'));
+ReactDOM.render(<App/>, document.getElementById("app"));

app/Routes.jsx

@@ -1,11 +1,11 @@
-import React, { Component } from 'react';
-import { Switch, Route, Redirect, withRouter } from 'react-router';
-import { connect } from 'react-redux';
+import React, { PureComponent } from "react";
+import { connect } from "react-redux";
+import { Switch, Route, Redirect, withRouter } from "react-router";
 
-import App from './containers/App';
-import Index from './containers/Index';
+import App from "./containers/App";
+import Index from "./containers/Index";
 
-class Routes extends Component {
+class Routes extends PureComponent {
 
     constructor(props) {
         super(props);
@@ -17,12 +17,12 @@ class Routes extends Component {
         if (this.props.authenticated) {
             return component;
         }
-        return <Redirect to={{pathname: '/login', state: { from: this.props.location }}}/>;
+        return <Redirect to={{ pathname: "/login", state: { from: this.props.location } }}/>;
     }
 
     checkAuth(component) {
         if (this.props.authenticated) {
-            const { from } = this.props.location.state || { from: { pathname: '/app' }};
+            const { from } = this.props.location.state || { from: { pathname: "/app" }};
             return <Redirect to={from}/>;
         }
         return component;

app/actions/courses.js

@@ -1,23 +1,23 @@
-import axios from 'axios';
+import axios from "axios";
 
-import * as types from './types';
+import * as types from "./types";
 
 export function createCourse(term, year, number, name, instructors) {
     return {
         type: types.CREATE_COURSE,
-        promise: axios.post('/api/courses', {
+        promise: axios.post("/api/courses", {
             term: term,
             year: year,
             number: number,
             name: name,
-            instructors: instructors
+            instructors: instructors,
         })
     };
 }
 
 export function getCourses() {
     return {
         type: types.GET_COURSES,
-        promise: axios.get('/api/courses')
+        promise: axios.get("/api/courses"),
     };
 }

app/actions/instructors.js

@@ -1,24 +1,24 @@
-import axios from 'axios';
+import axios from "axios";
 
-import * as types from './types';
+import * as types from "./types";
 
 export function loginInstructor(email, password) {
     return {
         type: types.LOGIN_INSTRUCTOR,
-        promise: axios.post('/login/instructor', {
+        promise: axios.post("/login/instructor", {
             email: email,
-            password: password
+            password: password,
         })
     };
 }
 
 export function createInstructor(name, email, password) {
     return {
         type: types.CREATE_INSTRUCTOR,
-        promise: axios.post('/signup/instructor', {
+        promise: axios.post("/signup/instructor", {
             name: name,
             email: email,
-            password: password
+            password: password,
         })
     };
 }

app/actions/students.js

@@ -1,23 +1,23 @@
-import axios from 'axios';
+import axios from "axios";
 
-import * as types from './types';
+import * as types from "./types";
 
 export function loginStudent(sid, username) {
     return {
         type: types.LOGIN_STUDENT,
-        promise: axios.post('/login/student', {
+        promise: axios.post("/login/student", {
             sid: sid,
-            username: username
+            username: username,
         })
     };
 }
 
 export function createStudent(course, sid) {
     return {
         type: types.CREATE_STUDENT,
-        promise: axios.post('/signup/student', {
+        promise: axios.post("/signup/student", {
             course: course,
-            sid: sid
+            sid: sid,
         })
     };
 }

app/actions/types.js

@@ -1,34 +1,34 @@
-export const LOGIN_STUDENT = 'LOGIN_STUDENT';
-export const LOGIN_STUDENT_REQUEST = 'LOGIN_STUDENT_REQUEST';
-export const LOGIN_STUDENT_SUCCESS = 'LOGIN_STUDENT_SUCCESS';
-export const LOGIN_STUDENT_FAILURE = 'LOGIN_STUDENT_FAILURE';
+export const LOGIN_STUDENT = "LOGIN_STUDENT";
+export const LOGIN_STUDENT_REQUEST = "LOGIN_STUDENT_REQUEST";
+export const LOGIN_STUDENT_SUCCESS = "LOGIN_STUDENT_SUCCESS";
+export const LOGIN_STUDENT_FAILURE = "LOGIN_STUDENT_FAILURE";
 
-export const LOGIN_INSTRUCTOR = 'LOGIN_INSTRUCTOR';
-export const LOGIN_INSTRUCTOR_REQUEST = 'LOGIN_INSTRUCTOR_REQUEST';
-export const LOGIN_INSTRUCTOR_SUCCESS = 'LOGIN_INSTRUCTOR_SUCCESS';
-export const LOGIN_INSTRUCTOR_FAILURE = 'LOGIN_INSTRUCTOR_FAILURE';
+export const LOGIN_INSTRUCTOR = "LOGIN_INSTRUCTOR";
+export const LOGIN_INSTRUCTOR_REQUEST = "LOGIN_INSTRUCTOR_REQUEST";
+export const LOGIN_INSTRUCTOR_SUCCESS = "LOGIN_INSTRUCTOR_SUCCESS";
+export const LOGIN_INSTRUCTOR_FAILURE = "LOGIN_INSTRUCTOR_FAILURE";
 
-export const LOGOUT = 'LOGOUT';
-export const LOGOUT_REQUEST = 'LOGOUT_REQUEST';
-export const LOGOUT_SUCCESS = 'LOGOUT_SUCCESS';
-export const LOGOUT_FAILURE = 'LOGOUT_FAILURE';
+export const LOGOUT = "LOGOUT";
+export const LOGOUT_REQUEST = "LOGOUT_REQUEST";
+export const LOGOUT_SUCCESS = "LOGOUT_SUCCESS";
+export const LOGOUT_FAILURE = "LOGOUT_FAILURE";
 
-export const CREATE_STUDENT = 'CREATE_STUDENT';
-export const CREATE_STUDENT_REQUEST = 'CREATE_STUDENT_REQUEST';
-export const CREATE_STUDENT_SUCCESS = 'CREATE_STUDENT_SUCCESS';
-export const CREATE_STUDENT_FAILURE = 'CREATE_STUDENT_FAILURE';
+export const CREATE_STUDENT = "CREATE_STUDENT";
+export const CREATE_STUDENT_REQUEST = "CREATE_STUDENT_REQUEST";
+export const CREATE_STUDENT_SUCCESS = "CREATE_STUDENT_SUCCESS";
+export const CREATE_STUDENT_FAILURE = "CREATE_STUDENT_FAILURE";
 
-export const CREATE_INSTRUCTOR = 'CREATE_INSTRUCTOR';
-export const CREATE_INSTRUCTOR_REQUEST = 'CREATE_INSTRUCTOR_REQUEST';
-export const CREATE_INSTRUCTOR_SUCCESS = 'CREATE_INSTRUCTOR_SUCCESS';
-export const CREATE_INSTRUCTOR_FAILURE = 'CREATE_INSTRUCTOR_FAILURE';
+export const CREATE_INSTRUCTOR = "CREATE_INSTRUCTOR";
+export const CREATE_INSTRUCTOR_REQUEST = "CREATE_INSTRUCTOR_REQUEST";
+export const CREATE_INSTRUCTOR_SUCCESS = "CREATE_INSTRUCTOR_SUCCESS";
+export const CREATE_INSTRUCTOR_FAILURE = "CREATE_INSTRUCTOR_FAILURE";
 
-export const CREATE_COURSE = 'CREATE_COURSE';
-export const CREATE_COURSE_REQUEST = 'CREATE_COURSE_REQUEST';
-export const CREATE_COURSE_SUCCESS = 'CREATE_COURSE_SUCCESS';
-export const CREATE_COURSE_FAILURE = 'CREATE_COURSE_FAILURE';
+export const CREATE_COURSE = "CREATE_COURSE";
+export const CREATE_COURSE_REQUEST = "CREATE_COURSE_REQUEST";
+export const CREATE_COURSE_SUCCESS = "CREATE_COURSE_SUCCESS";
+export const CREATE_COURSE_FAILURE = "CREATE_COURSE_FAILURE";
 
-export const GET_COURSES = 'GET_COURSES';
-export const GET_COURSES_REQUEST = 'GET_COURSES_REQUEST';
-export const GET_COURSES_SUCCESS = 'GET_COURSES_SUCCESS';
-export const GET_COURSES_FAILURE = 'GET_COURSES_FAILURE';
+export const GET_COURSES = "GET_COURSES";
+export const GET_COURSES_REQUEST = "GET_COURSES_REQUEST";
+export const GET_COURSES_SUCCESS = "GET_COURSES_SUCCESS";
+export const GET_COURSES_FAILURE = "GET_COURSES_FAILURE";

app/actions/users.js

@@ -1,10 +1,10 @@
-import axios from 'axios';
+import axios from "axios";
 
-import * as types from './types';
+import * as types from "./types";
 
 export function logout() {
     return {
         type: types.LOGOUT,
-        promise: axios.get('/api/logout')
+        promise: axios.get("/api/logout"),
     };
 }

app/api/promise.js

@@ -3,9 +3,9 @@ export default store => next => action => {
 
     if (!promise) return next(action);
 
-    const REQUEST = type + '_REQUEST';
-    const SUCCESS = type + '_SUCCESS';
-    const FAILURE = type + '_FAILURE';
+    const REQUEST = type + "_REQUEST";
+    const SUCCESS = type + "_SUCCESS";
+    const FAILURE = type + "_FAILURE";
 
     next({...rest, type: REQUEST});
     return promise

app/components/Home.jsx

@@ -1,17 +1,17 @@
-import React, {Component} from 'react';
-import { Button, ButtonToolbar, Row, Col, Jumbotron } from 'react-bootstrap';
+import React, { PureComponent } from "react";
+import { Button, ButtonToolbar, Row, Col, Jumbotron } from "react-bootstrap";
 
-class Home extends Component {
+class Home extends PureComponent {
 
     render() {
         return (
             <div>
                 <Row>
                     <Col md={7} sm={8} mdPush={5} smPush={4}>
-                        <Jumbotron style={{backgroundColor: 'white', textAlign: 'center'}}>
-                            <p style={{fontSize: '36px'}}>Make lectures more engaging.</p>
+                        <Jumbotron style={{ backgroundColor: "white", textAlign: "center" }}>
+                            <p style={{ fontSize: "36px" }}>Make lectures more engaging.</p>
                             <p>eLecture lets you engage with students during lectures so you can teach more - and the students can learn more.</p>
-                            <ButtonToolbar style={{display: 'inline-block'}}>
+                            <ButtonToolbar style={{ display: "inline-block" }}>
                                 <Button bsClass="btn btn-outline-info">Learn More</Button>
                                 <Button bsStyle="info" href="/signup">Get Started</Button>
                             </ButtonToolbar>

app/components/NotFound.jsx

@@ -1,7 +1,7 @@
-import React, { Component } from 'react';
-import { Button } from 'react-bootstrap';
+import React, { PureComponent } from "react";
+import { Button } from "react-bootstrap";
 
-class NotFound extends Component {
+class NotFound extends PureComponent {
 
     render() {
         return (

app/components/courses/Course.jsx

@@ -1,10 +1,10 @@
-import React, { Component } from 'react';
-import { Switch, Route, withRouter } from 'react-router';
+import React, { PureComponent } from "react";
+import { Switch, Route, withRouter } from "react-router";
 
-import CourseForm from '../../components/courses/CourseForm';
-import Lecture from '../../components/lectures/lecture';
+import CourseForm from "../../components/courses/CourseForm";
+import Lecture from "../../components/lectures/lecture";
 
-class Course extends Component {
+class Course extends PureComponent {
 
     render() {
         const course = this.props.courses.find(course => course._id === this.props.match.params.courseId);

app/components/courses/CourseButton.jsx

@@ -1,12 +1,12 @@
-import React, { Component } from 'react';
-import { Button } from 'react-bootstrap';
+import React, { PureComponent } from "react";
+import { Button } from "react-bootstrap";
 
-class CourseButton extends Component {
+class CourseButton extends PureComponent {
 
     render() {
         const { course } = this.props;
         return (
-            <Button bsClass="btn btn-info" href={'/app/courses/' + course._id}>
+            <Button bsClass="btn btn-info" href={"/app/courses/" + course._id}>
                 <div><h4>{course.number}</h4></div>
                 <div>{course.name}</div>
             </Button>

app/components/courses/CourseForm.jsx

@@ -1,6 +1,6 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 
-class CoursesForm extends Component {
+class CoursesForm extends PureComponent {
 
 }
 

app/components/courses/CourseJoinModal.jsx

@@ -1,6 +1,6 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 
-class CoursesAddForm extends Component {
+class CoursesAddForm extends PureComponent {
 
 }
 

app/components/courses/CourseSection.jsx

@@ -1,16 +1,16 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 import { Row, Col } from 'react-bootstrap';
 
 import CourseButton from './CourseButton';
 
-class CourseSection extends Component {
+class CourseSection extends PureComponent {
 
     render() {
         return (
             <div>
                 <h2>Courses</h2>
                 <Row>
-                    {this.props.courses.map(function (course, index) {
+                    {this.props.courses.map((course, index) => {
                         return (
                             <Col key={index} lg={3} md={4} sm={6}>
                                 <CourseButton course={course}/>