Feature/daniel/user profile

.babelrc

@@ -0,0 +1,35 @@
+{
+  "env": {
+    "development": {
+      "presets": [
+        "next/babel"
+      ],
+      "plugins": [
+        "inline-react-svg"
+      ]
+    },
+    "production": {
+      "presets": [
+        "next/babel"
+      ],
+      "plugins": [
+        "inline-react-svg"
+      ]
+    },
+    "test": {
+      "presets": [
+        [
+          "next/babel",
+          {
+            "preset-env": {
+              "modules": "commonjs"
+            }
+          }
+        ]
+      ],
+      "plugins": [
+        "inline-react-svg"
+      ]
+    }
+  }
+}

.eslintignore

@@ -8,5 +8,7 @@
 /tests/fixtures/**
 /tests/performance/**
 /tmp/**
+next.config.js
+
 
 # Add any other files or folders that you want eslint to ignore

.eslintrc.json

@@ -8,7 +8,8 @@
     "browser": true,
     "commonjs": true,
     "es6": true,
-    "node": true
+    "node": true,
+    "jest": true
   },
   "parser": "babel-eslint",
     "parserOptions":{
@@ -78,12 +79,15 @@
     "react/no-danger": "error",
     "react/jsx-pascal-case": "error",
     "react/jsx-indent": ["error", 4],
+    "react/jsx-indent-props": ["error", 4],
     "react/jsx-closing-bracket-location": "error",
     "react/void-dom-elements-no-children": "error",
     "react/jsx-tag-spacing": "error",
     "react/jsx-no-literals": "error",
     "react/jsx-wrap-multilines": "error",
-    "react/jsx-no-comment-textnodes": "error"
+    "react/jsx-no-comment-textnodes": "error",
+    "jsx-a11y/anchor-is-valid": 0,
+    "import/prefer-default-export": "off"
   },
   "settings": {
     "react": {

.gitignore

@@ -40,7 +40,7 @@ build/Release
 node_modules/
 jspm_packages/
 package-lock.json
-
+.DS_Store
 # TypeScript v1 declaration files
 typings/
 
@@ -69,6 +69,7 @@ typings/
 
 # next.js build output
 .next
+next.config.js
 
 # nuxt.js build output
 .nuxt

.travis.yml

@@ -1,3 +1,6 @@
 language: node_js
 node_js:
   - "node"
+script:
+  - npm run lint
+  - npm test

README.md

@@ -1,2 +1,14 @@
-# project-template
-Document your applications API and general usage
+# Project Help Me
+
+Help Me is an app that connects Depressed people to each other, essentially, it is a social network for depressed people where affected individuals can connect to seek help and therapy.
+
+![](static/helpme_landing.png)
+
+## Development
+
+- Clone this repo to your local machine using `git clone https://github.com/team-helpme/helpme`
+- `cd helpme`
+- `npm install`
+- `npm run dev`
+
+Antdesign is also used for the components, check <http://ant.design/docs/react/introduce>

components/authentication/actionTypes.js

@@ -0,0 +1,7 @@
+const actionTypes = {
+    GET_USER_PROFILE: 'GET_USER_PROFILE',
+    LOGIN_FAILURE: 'LOGIN_FAILURE',
+    LOGIN_SUCCESS: 'LOGIN_SUCCESS',
+};
+
+export default actionTypes;

components/authentication/actions.js

@@ -0,0 +1,16 @@
+import actionTypes from './actionTypes';
+
+const { LOGIN_FAILURE, LOGIN_SUCCESS, GET_USER_PROFILE } = actionTypes;
+
+export const loginFailure = () => ({
+    type: LOGIN_FAILURE,
+});
+
+export const loginSuccess = () => ({
+    type: LOGIN_SUCCESS,
+});
+
+export const getUserProfile = payload => ({
+    payload,
+    type: GET_USER_PROFILE,
+});

components/authentication/components/Authentication.css

@@ -0,0 +1,6 @@
+.loading_Div {
+    height: 100vh;
+    width: 100vw;
+    display: grid;
+    place-content: center;
+  }

components/authentication/components/Authentication.jsx

@@ -0,0 +1,59 @@
+/* eslint-disable no-shadow */
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import PropTypes from 'prop-types';
+import React, { PureComponent } from 'react';
+import Router from 'next/router';
+import { Spin } from 'antd';
+
+import { getUserProfile, loginFailure, loginSuccess } from '../actions';
+import { getIsAuthenticated, getUsersProfile } from '../selectors';
+import { handleAuthentication, isAuthenticated, login } from '../utils';
+import { SIGNING_IN_TEXT } from '../constants';
+
+class Authentication extends PureComponent {
+    componentDidMount() {
+        const { loginSuccess, loginFailure } = this.props;
+        try {
+            handleAuthentication().then(() => {
+                if (isAuthenticated()) {
+                    loginSuccess();
+                    Router.push('/timeline');
+                }
+            });
+        } catch (err) {
+            if (!isAuthenticated()) {
+                loginFailure();
+                login();
+            }
+        }
+    }
+
+    render() {
+        return (
+            <div className="loading_Div">
+                <Spin tip={SIGNING_IN_TEXT} size="large" />
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+    isAuthenticated: getIsAuthenticated(state),
+    userProfile: getUsersProfile(state),
+});
+
+const authActions = {
+    getUserProfile,
+    loginFailure,
+    loginSuccess,
+};
+
+const mapDispatchToProps = dispatch => bindActionCreators(authActions, dispatch);
+
+export default connect(mapStateToProps, mapDispatchToProps)(Authentication);
+
+Authentication.propTypes = {
+    loginFailure: PropTypes.func.isRequired,
+    loginSuccess: PropTypes.func.isRequired,
+};

components/authentication/components/index.js

@@ -0,0 +1,6 @@
+import 'antd/dist/antd.css';
+
+import './Authentication.css';
+import Authentication from './Authentication';
+
+export { Authentication };

components/authentication/constants.js

@@ -0,0 +1,2 @@
+export const NAME = 'auth';
+export const SIGNING_IN_TEXT = 'Signing you in ...';

components/authentication/index.js

@@ -0,0 +1,9 @@
+import * as actions from './actions';
+import * as components from './components';
+import * as utils from './utils';
+import authSagas from './sagas';
+import reducers from './reducers';
+
+export {
+    actions, components, authSagas, reducers, utils
+};

components/authentication/reducers.js

@@ -0,0 +1,23 @@
+import actionTypes from './actionTypes';
+
+const { GET_USER_PROFILE, LOGIN_FAILURE, LOGIN_SUCCESS } = actionTypes;
+
+const initialState = {
+    isAuthenticated: false,
+    usersProfile: null,
+};
+
+export default (state = initialState, action) => {
+    const { payload, type } = action;
+
+    switch (type) {
+    case LOGIN_FAILURE:
+        return { ...state, isAuthenticated: false };
+    case LOGIN_SUCCESS:
+        return { ...state, isAuthenticated: true };
+    case GET_USER_PROFILE:
+        return { ...state, usersProfile: payload };
+    default:
+        return state;
+    }
+};

components/authentication/sagas.js

@@ -0,0 +1,14 @@
+import { takeEvery, put } from 'redux-saga/effects';
+
+import actionTypes from './actionTypes';
+import { getUserProfile } from './actions';
+
+const { LOGIN_SUCCESS } = actionTypes;
+
+function* handleGetUserProfile(payload) {
+    yield put(getUserProfile(payload));
+}
+
+export default function* watchProfileDataLoad() {
+    yield takeEvery(LOGIN_SUCCESS, handleGetUserProfile);
+}

components/authentication/selectors.js

@@ -0,0 +1,4 @@
+import { NAME } from './constants';
+
+export const getIsAuthenticated = state => state[NAME].isAuthenticated;
+export const getUsersProfile = state => state[NAME].userProfile;

components/authentication/utils.js

@@ -0,0 +1,50 @@
+import auth0 from 'auth0-js';
+
+export const authConfig = new auth0.WebAuth({
+    clientID: `${process.env.clientID}`,
+    domain: 'teamhelpme.auth0.com',
+    redirectUri: 'http://localhost:3000/auth/signed-in',
+    responseType: 'token id_token',
+    scope: 'openid profile email',
+});
+
+export const setSession = authResult => {
+    // Set the time that the access token will expire at
+    const expiresAt = JSON.stringify((authResult.expiresIn * 1000) + new Date().getTime());
+    localStorage.setItem('access_token', authResult.accessToken);
+    localStorage.setItem('id_token', authResult.idToken);
+    localStorage.setItem('expires_at', expiresAt);
+    localStorage.setItem('profile', JSON.stringify(authResult.idTokenPayload));
+};
+
+export const login = () => {
+    authConfig.authorize();
+};
+
+export const logout = () => {
+    // Clear access token and ID token from local storage
+    localStorage.removeItem('access_token');
+    localStorage.removeItem('id_token');
+    localStorage.removeItem('expires_at');
+    localStorage.removeItem('profile');
+};
+
+export const handleAuthentication = () => new Promise((resolve, reject) => {
+    authConfig.parseHash((err, authResult) => {
+        if (authResult && authResult.accessToken && authResult.idToken) {
+            setSession(authResult);
+            return resolve();
+        } if (err) {
+            login();
+            return reject();
+        }
+        return reject();
+    });
+});
+
+export const isAuthenticated = () => {
+    // Check whether the current time is past the
+    // access token's expiry time
+    const expiresAt = JSON.parse(localStorage.getItem('expires_at'));
+    return new Date().getTime() < expiresAt;
+};

components/forum/actionTypes.js

@@ -0,0 +1,7 @@
+const actionTypes = {
+    REQUEST_LOAD_FORUM_DATA: 'REQUEST_LOAD_FORUM_DATA',
+    REQUEST_SET_FORUM_DATA_ERROR: 'REQUEST_SET_FORUM_DATA_ERROR',
+    REQUEST_SET_FORUM_DATA_SUCCESS: 'REQUEST_SET_FORUM_DATA_SUCCESS',
+};
+
+export default actionTypes;

components/forum/actions.js

@@ -0,0 +1,21 @@
+import actionTypes from './actionTypes';
+
+const {
+    REQUEST_LOAD_FORUM_DATA,
+    REQUEST_SET_FORUM_DATA_ERROR,
+    REQUEST_SET_FORUM_DATA_SUCCESS,
+} = actionTypes;
+
+export const loadForumData = () => ({
+    type: REQUEST_LOAD_FORUM_DATA,
+});
+
+export const setForumDataError = payload => ({
+    payload,
+    type: REQUEST_SET_FORUM_DATA_ERROR,
+});
+
+export const setForumDataSuccess = payload => ({
+    payload,
+    type: REQUEST_SET_FORUM_DATA_SUCCESS,
+});