vikingeducation · eglital · May 24, 2017 · May 25, 2017 · May 25, 2017 · May 25, 2017
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+/server/node_modules
+/server/.env
diff --git a/README.md b/README.md
@@ -1,2 +1,28 @@
-# assignment_djello
-Project management with that great wobbly taste.
+https://edjello.herokuapp.com
+# djello
+
+It is a single-page project management application. It allows teams to maintain "Boards", "Lists", and "Cards", each of which represents a task that needs to be done. The app smooths the process of assigning team members to particular tasks. Sign in with email test@gmail.com or test1@gmail.com with passwords 123456, and see how adding one user as a card member, allows that user to fully participate in all the board's that the card is in actions.
+
+## Getting Started
+
+You can clone it and test it on your machine! You have to have the server (run `nodemon server.js` or `node server.js` inside server directory) and client side (run `npm start` inside client directory) running.
+
+
+## Built With
+
+* [React] - front-end library to build single-page app
+* [Node, Express] - back-end
+* [PostgresSQL] - database
+* [Bootstrap 4] - styling
+
+## Deployment
+https://edjello.herokuapp.com - front-end React app
+https://djello-server.herokuapp.com/ - server
+
+## Authors
+
+* **Egle Libby** - (https://github.com/eglital)
+
+
+
+
diff --git a/client/.gitignore b/client/.gitignore
@@ -0,0 +1,21 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/client/README.md b/client/README.md
diff --git a/client/package.json b/client/package.json
@@ -0,0 +1,41 @@
+{
+  "name": "client",
+  "version": "0.1.0",
+  "private": true,
+  "proxy": "http://djello-server.herokuapp.com",
+  "dependencies": {
+    "axios": "^0.16.1",
+    "bcrypt": "^1.0.2",
+    "bootstrap": "^4.0.0-alpha.6",
+    "form-serialize": "^0.7.1",
+    "isomorphic-fetch": "^2.2.1",
+    "moment": "^2.18.1",
+    "react": "^15.5.4",
+    "react-addons-css-transition-group": "^15.5.2",
+    "react-addons-transition-group": "^15.5.2",
+    "react-cookie": "^2.0.7",
+    "react-dom": "^15.5.4",
+    "react-redux": "^4.4.8",
+    "react-router": "^4.1.1",
+    "react-router-dom": "^4.1.1",
+    "react-transition-group": "^1.1.3",
+    "reactstrap": "^4.6.2",
+    "redux": "^3.6.0",
+    "redux-form": "^6.0.0-rc.3",
+    "redux-thunk": "^2.2.0"
+  },
+  "devDependencies": {
+    "node-sass-chokidar": "0.0.2",
+    "react-scripts": "1.0.6",
+    "sass-loader": "^6.0.5"
+  },
+  "scripts": {
+    "build-css": "node-sass-chokidar src/ -o src/",
+   "watch-css": "npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive",
+    "start-js": "react-scripts start",
+    "start": "npm-run-all -p watch-css start-js",
+  "build": "npm run build-css && react-scripts build",
+    "test": "react-scripts test --env=jsdom",
+    "eject": "react-scripts eject"
+  }
+}
diff --git a/client/public/favicon.ico b/client/public/favicon.ico
diff --git a/client/public/index.html b/client/public/index.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="theme-color" content="#000000">
+    <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>React App</title>
+  </head>
+  <body>
+    <noscript>
+      You need to enable JavaScript to run this app.
+    </noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>
diff --git a/client/public/manifest.json b/client/public/manifest.json
@@ -0,0 +1,15 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "192x192",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}
diff --git a/client/src/App.test.js b/client/src/App.test.js
@@ -0,0 +1,8 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+it('renders without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<App />, div);
+});
diff --git a/client/src/_variables.scss b/client/src/_variables.scss
@@ -0,0 +1,13 @@
+
+$brand-primary:         #026AA7;
+$brand-success:         #91C500;
+$brand-info:            #1E97DF;
+$brand-danger:          #9804E9;
+$navbar-default-brand-color:           #0593E7;
+$dropdown-link-hover-color:                  #6FBCEA;
+$dropdown-link-active-bg: #6FBCEA;
+$link-color:            #8633B3;
+$input-bg:                       #D1ECFC;
+$body-bg:               #F4F5F1;
+$modal-md:                    600px
+
diff --git a/client/src/actions/auth.js b/client/src/actions/auth.js
@@ -0,0 +1,108 @@
+// There are three possible states for our login
+// process and we need actions for each of them
+export const LOGIN_REQUEST = "LOGIN_REQUEST";
+export const LOGIN_SUCCESS = "LOGIN_SUCCESS";
+export const LOGIN_FAILURE = "LOGIN_FAILURE";
+
+//change fetch url for development or production
+
+function requestLogin(creds) {
+  return {
+    type: LOGIN_REQUEST,
+    isFetching: true,
+    isAuthenticated: false,
+    creds
+  };
+}
+
+function receiveLogin(user) {
+  return {
+    type: LOGIN_SUCCESS,
+    isFetching: false,
+    isAuthenticated: true,
+    id_token: user.id_token,
+    userEmail: user.userEmail,
+    userId: user.userId
+  };
+}
+
+function loginError(message) {
+  return {
+    type: LOGIN_FAILURE,
+    isFetching: false,
+    isAuthenticated: false,
+    message
+  };
+}
+// Calls the API to get a token and
+// dispatches actions along the way
+export function loginUser(creds) {
+  let config = {
+    method: "POST",
+    headers: { "Content-Type": "application/x-www-form-urlencoded" },
+    body: `email=${creds.email}&password=${creds.password}`
+  };
+
+  return dispatch => {
+    // We dispatch requestLogin to kickoff the call to the API
+    dispatch(requestLogin(creds));
+
+    return fetch("https://djello-server.herokuapp.com/sessions/create", config)
+      .then(response => {
+        if (!response.ok) {
+          const error = new Error(response.statusText);
+          error.response = response;
+          console.log(error);
+          throw error;
+        }
+        return response.json();
+      })
+      .then(user => {
+        if (user) {
+          console.log(user);
+          // If login was successful, set the token in local storage
+          localStorage.setItem("token", user.token);
+          localStorage.setItem("userEmail", user.userEmail);
+          localStorage.setItem("userId", user.userId);
+          // Dispatch the success action
+          dispatch(receiveLogin(user));
+        }
+      })
+      .catch(error => dispatch(loginError(error.message)));
+  };
+}
+
+// Three possible states for our logout process as well.
+// Since we are using JWTs, we just need to remove the token
+// from localStorage. These actions are more useful if we
+// were calling the API to log the user out
+export const LOGOUT_REQUEST = "LOGOUT_REQUEST";
+export const LOGOUT_SUCCESS = "LOGOUT_SUCCESS";
+export const LOGOUT_FAILURE = "LOGOUT_FAILURE";
+
+function requestLogout() {
+  return {
+    type: LOGOUT_REQUEST,
+    isFetching: true,
+    isAuthenticated: true
+  };
+}
+
+function receiveLogout() {
+  return {
+    type: LOGOUT_SUCCESS,
+    isFetching: false,
+    isAuthenticated: false
+  };
+}
+
+// Logs the user out
+export function logoutUser() {
+  return dispatch => {
+    dispatch(requestLogout());
+    localStorage.removeItem("token");
+    localStorage.removeItem("userEmail");
+    localStorage.removeItem("userId");
+    dispatch(receiveLogout());
+  };
+}