From 52de8fb77899923e02017b02df666b08543077c1 Mon Sep 17 00:00:00 2001 From: Rupeshiya Date: Sun, 14 Jun 2020 15:25:37 +0530 Subject: [PATCH 1/2] intial working mechanism for notifications integrated --- package-lock.json | 248 ++++++++++++++++++ package.json | 4 +- src/actions/authAction.js | 1 + src/actions/notificationAction.js | 41 +++ src/actions/types.js | 5 +- src/reducers/index.js | 2 + src/reducers/notificationReducer.js | 26 ++ .../news-feed/popups/AddPostModal.js | 9 +- .../dashboard/notifications/notifications.js | 97 ++++++- src/user/dashboard/utils/notification.js | 195 ++++++++++++++ src/user/dashboard/utils/socket.js | 3 + 11 files changed, 620 insertions(+), 11 deletions(-) create mode 100644 src/actions/notificationAction.js create mode 100644 src/reducers/notificationReducer.js create mode 100644 src/user/dashboard/utils/notification.js create mode 100644 src/user/dashboard/utils/socket.js diff --git a/package-lock.json b/package-lock.json index ce5a8b59..0353da52 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2006,6 +2006,11 @@ } } }, + "after": { + "version": "0.8.2", + "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz", + "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8=" + }, "aggregate-error": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.0.1.tgz", @@ -2204,6 +2209,11 @@ "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz", "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=" }, + "arraybuffer.slice": { + "version": "0.0.7", + "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz", + "integrity": "sha512-wGUIVQXuehL5TCqQun8OW81jGzAWycqzFF8lFp+GOM5BXLYj3bKNsYC4daB7n6XjCqxQA/qgTJ+8ANR3acjrog==" + }, "arrify": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz", @@ -2702,6 +2712,11 @@ "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz", "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==" }, + "backo2": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz", + "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc=" + }, "balanced-match": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", @@ -2762,6 +2777,11 @@ } } }, + "base64-arraybuffer": { + "version": "0.1.5", + "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz", + "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg=" + }, "base64-js": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.3.1.tgz", @@ -2780,6 +2800,14 @@ "tweetnacl": "^0.14.3" } }, + "better-assert": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz", + "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI=", + "requires": { + "callsite": "1.0.0" + } + }, "big.js": { "version": "5.2.2", "resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz", @@ -2799,6 +2827,11 @@ "file-uri-to-path": "1.0.0" } }, + "blob": { + "version": "0.0.5", + "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.5.tgz", + "integrity": "sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig==" + }, "block-stream": { "version": "0.0.9", "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz", @@ -3133,6 +3166,11 @@ "caller-callsite": "^2.0.0" } }, + "callsite": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz", + "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA=" + }, "callsites": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz", @@ -3970,11 +4008,21 @@ "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz", "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=" }, + "component-bind": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz", + "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E=" + }, "component-emitter": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz", "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==" }, + "component-inherit": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz", + "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM=" + }, "compose-function": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/compose-function/-/compose-function-3.0.3.tgz", @@ -5031,6 +5079,46 @@ "once": "^1.4.0" } }, + "engine.io-client": { + "version": "3.4.3", + "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-3.4.3.tgz", + "integrity": "sha512-0NGY+9hioejTEJCaSJZfWZLk4FPI9dN+1H1C4+wj2iuFba47UgZbJzfWs4aNFajnX/qAaYKbe2lLTfEEWzCmcw==", + "requires": { + "component-emitter": "~1.3.0", + "component-inherit": "0.0.3", + "debug": "~4.1.0", + "engine.io-parser": "~2.2.0", + "has-cors": "1.1.0", + "indexof": "0.0.1", + "parseqs": "0.0.5", + "parseuri": "0.0.5", + "ws": "~6.1.0", + "xmlhttprequest-ssl": "~1.5.4", + "yeast": "0.1.2" + }, + "dependencies": { + "ws": { + "version": "6.1.4", + "resolved": "https://registry.npmjs.org/ws/-/ws-6.1.4.tgz", + "integrity": "sha512-eqZfL+NE/YQc1/ZynhojeV8q+H050oR8AZ2uIev7RU10svA9ZnJUddHcOUZTJLinZ9yEfdA2kSATS2qZK5fhJA==", + "requires": { + "async-limiter": "~1.0.0" + } + } + } + }, + "engine.io-parser": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-2.2.0.tgz", + "integrity": "sha512-6I3qD9iUxotsC5HEMuuGsKA0cXerGz+4uGcXQEkfBidgKf0amsjrrtwcbwK/nzpZBxclXlV7gGl9dgWvu4LF6w==", + "requires": { + "after": "0.8.2", + "arraybuffer.slice": "~0.0.7", + "base64-arraybuffer": "0.1.5", + "blob": "0.0.5", + "has-binary2": "~1.0.2" + } + }, "enhanced-resolve": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.1.1.tgz", @@ -6635,6 +6723,26 @@ } } }, + "has-binary2": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/has-binary2/-/has-binary2-1.0.3.tgz", + "integrity": "sha512-G1LWKhDSvhGeAQ8mPVQlqNcOB2sJdwATtZKl2pDKKHfpf/rYj24lkinxf69blJbnsvtqqNU+L3SL50vzZhXOnw==", + "requires": { + "isarray": "2.0.1" + }, + "dependencies": { + "isarray": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz", + "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4=" + } + } + }, + "has-cors": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz", + "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk=" + }, "has-flag": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", @@ -7028,6 +7136,11 @@ "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz", "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=" }, + "indexof": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz", + "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10=" + }, "infer-owner": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz", @@ -9884,6 +9997,11 @@ "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" }, + "object-component": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz", + "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE=" + }, "object-copy": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/object-copy/-/object-copy-0.1.0.tgz", @@ -10289,6 +10407,22 @@ "resolved": "https://registry.npmjs.org/parse5/-/parse5-4.0.0.tgz", "integrity": "sha512-VrZ7eOd3T1Fk4XWNXMgiGBK/z0MG48BWG2uQNU4I72fkQuKUTZpl+u9k+CxEG0twMVzSmXEEz12z5Fnw1jIQFA==" }, + "parseqs": { + "version": "0.0.5", + "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz", + "integrity": "sha1-1SCKNzjkZ2bikbouoXNoSSGouJ0=", + "requires": { + "better-assert": "~1.0.0" + } + }, + "parseuri": { + "version": "0.0.5", + "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz", + "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo=", + "requires": { + "better-assert": "~1.0.0" + } + }, "parseurl": { "version": "1.3.3", "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz", @@ -11787,6 +11921,11 @@ } } }, + "react-detect-offline": { + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/react-detect-offline/-/react-detect-offline-2.4.0.tgz", + "integrity": "sha512-OHglQ8bpbM4x8m23RhRCm1e1cYtuCoLQ7NKHsC0zzm1z2vQIrNTq7MvhZTQ7TsbgK1XapMewLxGW9QEW3DXC9A==" + }, "react-dev-utils": { "version": "10.0.0", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-10.0.0.tgz", @@ -11970,6 +12109,14 @@ "lottie-web": "^5.1.3" } }, + "react-offline": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/react-offline/-/react-offline-0.1.0.tgz", + "integrity": "sha512-Q41bcKI1TTohT0UaagHC31WbzgARqlucWG6A2S1Ux9nnqvLAWxKo8wsvWITcCuSq38/U640pws/JT+JulO4khg==", + "requires": { + "prop-types": "^15.5.10" + } + }, "react-overlays": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-2.1.0.tgz", @@ -12113,6 +12260,29 @@ "workbox-webpack-plugin": "4.3.1" } }, + "react-toastify": { + "version": "6.0.5", + "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-6.0.5.tgz", + "integrity": "sha512-1YXSb6Jr478c1TJEyVpxLHFvtmeXGMvdpZc0fke/7lK+MoLBC+NFgB74bq+C2SZe6LdK+K1voEURJoY88WqWvA==", + "requires": { + "classnames": "^2.2.6", + "prop-types": "^15.7.2", + "react-transition-group": "^4.4.1" + }, + "dependencies": { + "react-transition-group": { + "version": "4.4.1", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz", + "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + } + } + } + }, "react-transition-group": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.3.0.tgz", @@ -13370,6 +13540,69 @@ "kind-of": "^3.2.0" } }, + "socket.io-client": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-2.3.0.tgz", + "integrity": "sha512-cEQQf24gET3rfhxZ2jJ5xzAOo/xhZwK+mOqtGRg5IowZsMgwvHwnf/mCRapAAkadhM26y+iydgwsXGObBB5ZdA==", + "requires": { + "backo2": "1.0.2", + "base64-arraybuffer": "0.1.5", + "component-bind": "1.0.0", + "component-emitter": "1.2.1", + "debug": "~4.1.0", + "engine.io-client": "~3.4.0", + "has-binary2": "~1.0.2", + "has-cors": "1.1.0", + "indexof": "0.0.1", + "object-component": "0.0.3", + "parseqs": "0.0.5", + "parseuri": "0.0.5", + "socket.io-parser": "~3.3.0", + "to-array": "0.1.4" + }, + "dependencies": { + "component-emitter": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz", + "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY=" + } + } + }, + "socket.io-parser": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.3.0.tgz", + "integrity": "sha512-hczmV6bDgdaEbVqhAeVMM/jfUfzuEZHsQg6eOmLgJht6G3mPKMxYm75w2+qhAQZ+4X+1+ATZ+QFKeOZD5riHng==", + "requires": { + "component-emitter": "1.2.1", + "debug": "~3.1.0", + "isarray": "2.0.1" + }, + "dependencies": { + "component-emitter": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz", + "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY=" + }, + "debug": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz", + "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==", + "requires": { + "ms": "2.0.0" + } + }, + "isarray": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.1.tgz", + "integrity": "sha1-o32U7ZzaLVmGXJ92/llu4fM4dB4=" + }, + "ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" + } + } + }, "sockjs": { "version": "0.3.19", "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.19.tgz", @@ -14162,6 +14395,11 @@ "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz", "integrity": "sha1-I2QN17QtAEM5ERQIIOXPRA5SHdE=" }, + "to-array": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz", + "integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA=" + }, "to-arraybuffer": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz", @@ -15387,6 +15625,11 @@ "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz", "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==" }, + "xmlhttprequest-ssl": { + "version": "1.5.5", + "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz", + "integrity": "sha1-wodrBhaKrcQOV9l+gRkayPQ5iz4=" + }, "xtend": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz", @@ -15457,6 +15700,11 @@ "camelcase": "^5.0.0", "decamelize": "^1.2.0" } + }, + "yeast": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz", + "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk=" } } } diff --git a/package.json b/package.json index e3071a2b..f6e8fef9 100644 --- a/package.json +++ b/package.json @@ -25,8 +25,10 @@ "react-responsive": "^8.0.3", "react-router-dom": "^5.1.2", "react-scripts": "3.3.0", + "react-toastify": "^6.0.5", "redux": "^4.0.5", - "redux-thunk": "^2.3.0" + "redux-thunk": "^2.3.0", + "socket.io-client": "^2.3.0" }, "proxy": "http://localhost:5000", "scripts": { diff --git a/src/actions/authAction.js b/src/actions/authAction.js index c578bbda..35d2f8d3 100644 --- a/src/actions/authAction.js +++ b/src/actions/authAction.js @@ -40,6 +40,7 @@ export const loginUser = (userInfo, history) => async (dispatch) => { // update state with user const decodedData = await jwt_decode(token); + localStorage.setItem('userId', decodedData._id) dispatch(setCurrentUser(decodedData)); history.push("/dashboard"); diff --git a/src/actions/notificationAction.js b/src/actions/notificationAction.js new file mode 100644 index 00000000..7059e299 --- /dev/null +++ b/src/actions/notificationAction.js @@ -0,0 +1,41 @@ +import { GET_PLATFORM_NOTIFICATIONS, GET_USER_NOTIFICATIONS } from './types' +import axios from 'axios' +import { errorHandler } from '../utils/errorHandler'; +import { setRequestStatus } from '../utils/setRequestStatus'; + +// GET NOTIFICATIONS FOR WHOLE PLATFORM AS WELL AS FOR A USER +export const getAllNotifications = () => async (dispatch) => { + try { + const res = await axios.get('/notification/org/all') + dispatch(setRequestStatus(false)) + if (res.status === 200) { + dispatch(setRequestStatus(true)) + console.log('Whole platform notification ', res.data.notifications) + + dispatch({ + type: GET_PLATFORM_NOTIFICATIONS, + payload: res.data.notifications + }) + } + } catch (error) { + dispatch(errorHandler(error)) + } +} + +// GET NOTIFICATIONS FOR A USER +export const getUserNotification = () => async (dispatch) => { + try { + const res = await axios.get('/notification/user/all') + dispatch(setRequestStatus(false)) + if (res.status === 200) { + dispatch(setRequestStatus(true)) + console.log('User notification ', res.data.notifications) + dispatch({ + type: GET_USER_NOTIFICATIONS, + payload: res.data.notifications + }) + } + } catch (error) { + dispatch(errorHandler(error)) + } +} diff --git a/src/actions/types.js b/src/actions/types.js index 12e80bbb..43b01ba3 100644 --- a/src/actions/types.js +++ b/src/actions/types.js @@ -3,4 +3,7 @@ export const SET_CURRENT_USER = "SET_CURRENT_USER"; export const RESPONSE_MSG = "RESPONSE_MSG"; export const GET_ERRORS = "GET_ERRORS"; export const SET_ERROR = "SET_ERROR"; -export const SET_STATUS = "SET_STATUS"; \ No newline at end of file +export const SET_STATUS = "SET_STATUS"; +export const GET_PLATFORM_NOTIFICATIONS = "GET_PLATFORM_NOTIFICATIONS"; +export const GET_USER_NOTIFICATIONS = "GET_USER_NOTIFICATIONS"; +export const GET_ALL_NOTIFICATIONS = "GET_ALL_NOTIFICATIONS"; \ No newline at end of file diff --git a/src/reducers/index.js b/src/reducers/index.js index 406405d8..5aa6d152 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -4,11 +4,13 @@ import postReducers from './postReducer'; import userReducers from './userReducer'; import errorReducer from './errorReducer'; import requestStatus from './requestStatus'; +import notificationReducer from './notificationReducer' const rootReducer = combineReducers({ auth: authReducers, post: postReducers, user: userReducers, + notification: notificationReducer, error: errorReducer, status: requestStatus }); diff --git a/src/reducers/notificationReducer.js b/src/reducers/notificationReducer.js new file mode 100644 index 00000000..e6a2f32b --- /dev/null +++ b/src/reducers/notificationReducer.js @@ -0,0 +1,26 @@ +import { GET_PLATFORM_NOTIFICATIONS, GET_USER_NOTIFICATIONS } from "../actions/types" + +const initialState = { + platformNotifications: [], + userNotifications: [] +} + +export default (state = initialState, action) => { + switch(action.type) { + case GET_PLATFORM_NOTIFICATIONS: { + return { + ...state, + platformNotifications: [action.payload, ...state.platformNotifications][0] + } + } + case GET_USER_NOTIFICATIONS: { + return { + ...state, + userNotifications: [action.payload, ...state.userNotifications][0] + } + } + default: { + return state + } + } +} \ No newline at end of file diff --git a/src/user/dashboard/news-feed/popups/AddPostModal.js b/src/user/dashboard/news-feed/popups/AddPostModal.js index 6b639555..37181a58 100644 --- a/src/user/dashboard/news-feed/popups/AddPostModal.js +++ b/src/user/dashboard/news-feed/popups/AddPostModal.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import { Button, Modal, Form, Col } from "react-bootstrap"; import PropTypes from "prop-types"; @@ -6,13 +6,12 @@ const AddPostModal = (props) => { const [content, setContent] = useState(""); const onChange = (event) => { - console.log("Setting content value! ", event.target.value); setContent(event.target.value); }; - const createPost = (content) => { + const createPost = async (content) => { console.log("Creating the post ", content); - // ADD REQUEST TO + props.onHide() }; return ( @@ -55,7 +54,7 @@ const AddPostModal = (props) => {
- +
{membersList || 'NO MEMBERS FOUND!' }
@@ -127,4 +172,12 @@ class MemberInfo extends Component { ); } } -export default MemberInfo; \ No newline at end of file + +// map state to props +const mapStateToProps = (state) => ({ + auth: state.auth, + error: state.error, + insight: state.insight +}) + +export default connect(mapStateToProps, { getMembers, getMember })(MemberInfo); \ No newline at end of file diff --git a/src/user/dashboard/insights/components/memberInfo.scss b/src/user/dashboard/insights/components/memberInfo.scss index 97253cd6..847f1295 100644 --- a/src/user/dashboard/insights/components/memberInfo.scss +++ b/src/user/dashboard/insights/components/memberInfo.scss @@ -44,6 +44,16 @@ padding: 0.4em; margin-top: 0.5em; } + .search_btn { + width: 11vw; + height: 5vh; + background: rgb(250, 251, 252); + border-radius: 100px; + color: #1A73E8; + padding: 0.3em; + margin-left: 1em; + height: 42.2px; + } .members_list { display: flex; padding: 0.3em; diff --git a/src/user/dashboard/news-feed/news-feed.scss b/src/user/dashboard/news-feed/news-feed.scss index ecccc4e7..a25a98bf 100644 --- a/src/user/dashboard/news-feed/news-feed.scss +++ b/src/user/dashboard/news-feed/news-feed.scss @@ -368,7 +368,7 @@ } .news__feed__container { .post { - width: 139%; + width: 130%; margin-bottom: 17px; } } diff --git a/src/user/dashboard/news-feed/popups/AddEventModal.js b/src/user/dashboard/news-feed/popups/AddEventModal.js index dd1efa11..105f46ca 100644 --- a/src/user/dashboard/news-feed/popups/AddEventModal.js +++ b/src/user/dashboard/news-feed/popups/AddEventModal.js @@ -1,8 +1,49 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; import { Button, Modal, Form, Col } from "react-bootstrap"; import PropTypes from "prop-types"; +import { connect } from 'react-redux'; +import { createEvent } from '../../../../actions/dashboardAction'; const AddEventModal = (props) => { + const [eventName, setEventName] = useState(""); + const [eventDate, setEventDate] = useState(""); + const [location, setLocation] = useState(""); + const [shortDescription, setShortDescription] = useState(""); + const [longDescription, setLongDescription] = useState(""); + const [eventTime, setEventTime] = useState(""); + + const onEventName = (event) => { + setEventName(event.target.value); + }; + const onEventDate = (event) => { + setEventDate(event.target.value); + }; + const onEventLocation = (event) => { + setLocation(event.target.value); + }; + const onShortDesc = (event) => { + setShortDescription(event.target.value); + }; + const onLongDesc = (event) => { + setLongDescription(event.target.value); + }; + const onEventTime = (event) => { + setEventTime(event.target.value) + } + const onCreateEventClick = () => { + const obj = { + location, + eventName, + eventDate, + description: { + shortDescription, + longDescription + } + } + props.createEvent(obj) + props.handleClose() + } + return ( { className="modal__group" > Event Name - + { className="modal__group" > Location - + @@ -49,7 +98,11 @@ const AddEventModal = (props) => { className="modal__group" > Date - + { className="modal__group" > Time - + @@ -67,18 +124,26 @@ const AddEventModal = (props) => { controlId="formGridEmail" className="modal__group" > - Post Description + Event Description
+
- :
} -

{event.description}

+
{event.eventName}
+ {event.isOnline ? :
} +

{event.description.shortDescription}

@@ -32,5 +55,10 @@ class UpcomingEvents extends Component { ); } } +const mapStateToProps = (state) => ({ + auth: state.auth, + error: state.error, + dashboard: state.dashboard +}) -export default UpcomingEvents; +export default connect(mapStateToProps, { upcomingEvents })(UpcomingEvents); diff --git a/src/user/dashboard/utils/notification.js b/src/user/dashboard/utils/notification.js index 7f52b49a..8ad1e6aa 100644 --- a/src/user/dashboard/utils/notification.js +++ b/src/user/dashboard/utils/notification.js @@ -22,35 +22,36 @@ }); state.socket.on('Password update', (data) => { - console.log('Password updated!'); - addToNotification({ - imgSrc: donutIcon, - heading: 'Forgot password!', - content: `${data.data}`, - tag: 'Update' - }) + let userId = JSON.stringify(localStorage.getItem("userId")); + if(userId === data.userId) { + addToNotification({ + imgSrc: donutIcon, + heading: "Forgot password!", + content: `${data.data}`, + tag: "Update", + }); + } }) state.socket.on('Account activate', (data) => { - console.log('Password updated!'); - addToNotification({ - imgSrc: donutIcon, - heading: 'Account activate', - content: `${data.data}`, - tag: 'Activate' - }) + let userId = JSON.stringify(localStorage.getItem('userId')) + if(userId === data.userId){ + addToNotification({ + imgSrc: donutIcon, + heading: 'Account activate', + content: `${data.data}`, + tag: 'Activate' + }) + } }) state.socket.on('New follower', (data) => { - console.log('New follower'); let userId = JSON.stringify(localStorage.getItem('userId')) - console.log('userId ', userId) - console.log('data ', JSON.parse(data)) - if (userId === data.data.obj) { + if (userId === data.followId) { addToNotification({ imgSrc: donutIcon, heading: 'New follower', - content: `${data.data.obj.name} started following you!`, + content: `${data.name} started following you!`, tag: 'Follower' }) } diff --git a/src/user/events/popups/popup.scss b/src/user/events/popups/popup.scss index b8a6018e..48a1f36c 100644 --- a/src/user/events/popups/popup.scss +++ b/src/user/events/popups/popup.scss @@ -39,6 +39,7 @@ .form-footer { margin-top: 0; + margin-left: 2px; Button { width: 90px; margin-right: 20px; @@ -51,7 +52,7 @@ } } .modal-backdrop { - background: rgba(0, 0, 0, 0.6) !important; + background: rgba(0, 0, 0, 0.2) !important; } .modal-backdrop.in{ opacity: 0.5; diff --git a/src/user/organization/popups/Admins.js b/src/user/organization/popups/Admins.js index d8dc1471..501e44a4 100644 --- a/src/user/organization/popups/Admins.js +++ b/src/user/organization/popups/Admins.js @@ -1,3 +1,4 @@ +/* eslint-disable no-unused-expressions */ import React, { Component } from "react"; import { Modal, Button, Row, Col, Image, Form } from "react-bootstrap"; import logo from "../../../svgs/logo-image.jpg"; @@ -6,7 +7,8 @@ class Admins extends Component { constructor(props) { super(props); this.state = { - text: 'Follow' + text: 'Follow', + admins: [] } } onRemoveClick = (index) => { @@ -14,16 +16,18 @@ class Admins extends Component { // SEND REQUEST TO REMOVE USER WITH ID = INDEX FROM ADMINISTRATORs LIST } + componentWillReceiveProps(nextProps) { + let adminsInfo = [] + nextProps.admins?.forEach((admin) => { + adminsInfo.push({ name: admin.name.firstName + ' ' + admin.name.lastName, desc: admin.info.about?.designation, _id: admin._id }) + }) + this.setState({ admins: adminsInfo }) + } + render() { - const adminList = [ - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'} - ] - let admins = adminList.map((item, index) => ( - + const adminList = [...this.state.admins] + let admins = adminList.map((item) => ( +
I
@@ -34,7 +38,7 @@ class Admins extends Component {
diff --git a/src/user/organization/popups/Members.js b/src/user/organization/popups/Members.js index 10ea022a..ae665f02 100644 --- a/src/user/organization/popups/Members.js +++ b/src/user/organization/popups/Members.js @@ -6,24 +6,28 @@ class Members extends Component { constructor(props) { super(props); this.state = { - text: 'Follow' + text: 'Follow', + members: [] } } - onFollowClick = (index) => { - console.log('Start following!', index); - // SEND REQUEST TO FOLLOW USER WITH ID = INDEX + + onRemoveClick = (index) => { + console.log('Blocking !', index); + // SEND REQUEST TO REMOVE USER WITH ID = INDEX + } + + componentWillReceiveProps(nextProps) { + let membersInfo = [] + nextProps.members.forEach((member) => { + membersInfo.push({ name: member.name.firstName + ' ' + member.name.lastName, desc: member.info.about.designation || 'UI/UX' , _id: member._id }) + }) + this.setState({ members: membersInfo }) } render() { - const membersList = [ - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'}, - {name: 'John Doe', desc : 'UI/UX'} - ] - let members = membersList.map((item, index) => ( - + const membersList = [ ...this.state.members] + let members = membersList.map((item) => ( +
I
@@ -34,7 +38,7 @@ class Members extends Component {
diff --git a/src/user/pinned-posts/pinned-posts.js b/src/user/pinned-posts/pinned-posts.js index 5381af7c..ce5f0c88 100644 --- a/src/user/pinned-posts/pinned-posts.js +++ b/src/user/pinned-posts/pinned-posts.js @@ -31,7 +31,7 @@ class PinnedPosts extends Component { {this.state.isLoading ? pinnedPostsLoading() : }
- {this.state.isLoading ? orgUpdatesLoading() : } + {/* {this.state.isLoading ? orgUpdatesLoading() : } */}
); diff --git a/src/user/profile/popups/Followers.js b/src/user/profile/popups/Followers.js index 2e9875c8..66ad9837 100644 --- a/src/user/profile/popups/Followers.js +++ b/src/user/profile/popups/Followers.js @@ -11,15 +11,17 @@ class Followers extends Component { } } render() { - const { borderStyle, onHide } = this.props - let followersList = [ - {name: 'John Doe', desg: 'UI/UX'}, - {name: 'John Doe', desg: 'UI/UX'}, - {name: 'John Doe', desg: 'UI/UX'}, - {name: 'John Doe', desg: 'UI/UX'}, - {name: 'John Doe', desg: 'UI/UX'} - ]; - let followers = followersList.map((item, index) => ( + const { borderStyle, onHide, followers } = this.props + let followersList = [] + + for(const follower in followers) { + let tempObj = {} + tempObj.name = followers[follower].name.firstName + ' ' + followers[follower].name.lastName; + tempObj.desg = followers[follower].info.about.designation || 'NA'; + followersList.push(tempObj) + } + + let followersContent = followersList.map((item, index) => (
PEOPLE WHO FOLLOW YOU
- {followers} + {followersContent} ); diff --git a/src/user/profile/popups/Logout.js b/src/user/profile/popups/Logout.js index d010eb67..0b26f16d 100644 --- a/src/user/profile/popups/Logout.js +++ b/src/user/profile/popups/Logout.js @@ -19,7 +19,7 @@ class Logout extends Component { @@ -45,8 +45,9 @@ class Logout extends Component {
- - -
- - ); - } -} -// map state to props -const mapStateToProps = (state) => ({ - auth: state.auth, - error: state.error, -}); - -export default connect(mapStateToProps, { logoutUser })(withRouter(Logout)); diff --git a/src/user/setup/Setup.js b/src/user/setup/Setup.js index 0c20d3f8..01eb0027 100644 --- a/src/user/setup/Setup.js +++ b/src/user/setup/Setup.js @@ -6,6 +6,8 @@ import AboutDonut from './components/AboutDonut' import SetupForm from './components/SetupForm' import ShadowDonut from '../../images/shadowDonut.png' import SetupPreview from './components/SetupPreview' +import { connect } from 'react-redux' +import { registerCommunity } from '../../actions/orgAction' class Setup extends Component { constructor(props) { @@ -16,9 +18,11 @@ class Setup extends Component { shortDesc: '', longDesc : '', website: '', - fb: '', + email: '', github: '', - theme: '' + color: '', + chatPlatform: '', + error: null } } // Handle fields change @@ -26,6 +30,13 @@ class Setup extends Component { this.setState({ [input]: e.target.value }); }; + // Handle theme change + handleThemeChange = input => e => { + this.setState({ [input]: e.target.value }, () => { + console.log('this.state ', this.state) + }) + } + onNext = () => { const { step } = this.state; this.setState({ @@ -43,14 +54,42 @@ class Setup extends Component { console.log('state is : ', this.state) }) } + onFinish = () => { - console.log('Finish message from setup page!'); + console.log('Finish message from setup page!', this.state); + const { communityName, shortDesc, longDesc, email, website, chatPlatform, color } = this.state + const orgObj = { + name: communityName, + description: { + shortDescription: shortDesc, + longDescription: longDesc + }, + contactInfo: { + email: email, + website: website, + chattingPlatform: [{ + link: chatPlatform + }] + } + } + // store theme in local storage + localStorage.setItem('theme', JSON.stringify(color)); + this.props.registerCommunity(orgObj) + } + + componentWillReceiveProps(nextProps) { + const { msg } = nextProps.error; + if (msg == null || msg == undefined) { + window.location.href = "/dashboard"; + } else { + this.setState({ error: msg }); + } } render() { const { step } = this.state; - const { communityName, website, fb, github, shortDesc, longDesc, theme } = this.state; - const values = { communityName, website, fb, github, shortDesc, longDesc, theme }; + const { communityName, website, email, github, shortDesc, longDesc, color, chatPlatform, error } = this.state; + const values = { communityName, website, email, github, shortDesc, longDesc, color, chatPlatform, error }; const returnStep = (step) => { switch (step) { case 0: { @@ -76,7 +115,7 @@ class Setup extends Component { return ( ({ + auth: state.auth, + error: state.error, + status: state.status +}) + +export default connect(mapStateToProps, { registerCommunity })(Setup); \ No newline at end of file diff --git a/src/user/setup/components/SetupForm.js b/src/user/setup/components/SetupForm.js index 90598674..8e110eda 100644 --- a/src/user/setup/components/SetupForm.js +++ b/src/user/setup/components/SetupForm.js @@ -28,6 +28,7 @@ class SetupForm extends Component {

ABOUT

+ {values.error ? (

{values.error}

): null} Community Name @@ -96,31 +97,31 @@ class SetupForm extends Component { - Facebook link + Email - Github link + Chat platform link @@ -140,4 +141,5 @@ class SetupForm extends Component { ); } } + export default SetupForm; \ No newline at end of file diff --git a/src/user/setup/components/SetupPreview.js b/src/user/setup/components/SetupPreview.js index c47e6a8b..fbf8457b 100644 --- a/src/user/setup/components/SetupPreview.js +++ b/src/user/setup/components/SetupPreview.js @@ -4,7 +4,6 @@ import DonutPreview from '../../../images/preview.jpg' import UploadPreview from '../../../images/upload.jpg' import ShadowPreview from '../../../images/shadowDonut.png' import CommunityPreview from '../../../images/community.png' -import Dashboard from '../../dashboard/dashboard' import './preview.scss' let donutPreviewImage = DonutPreview @@ -12,7 +11,8 @@ class SetupPreview extends Component { constructor(props) { super(props); this.state = { - color: 'aqua' + color: 'aqua', + error: '' } } @@ -57,7 +57,7 @@ class SetupPreview extends Component { } } render() { - const { values, handleChange } = this.props; + const { values, handleThemeChange } = this.props; return (
@@ -66,6 +66,7 @@ class SetupPreview extends Component {
+ {values.error ? (

{values.error}

): null}

THEME

@@ -76,38 +77,51 @@ class SetupPreview extends Component { defaultChecked={true} /> - - + + Community Color - - - - - + + + + + - +
-
+

PREVIEW

- preview - {/* */} + preview
- - +
- ) + ); } } -export default SetupPreview \ No newline at end of file +export default SetupPreview; \ No newline at end of file