1 files changed, 134 insertions, 68 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/userNotifications/NotificationsView.jsx b/openecomp-ui/src/sdc-app/onboarding/userNotifications/NotificationsView.jsx
index de105d23a7..7f5b334586 100644
--- a/openecomp-ui/src/sdc-app/onboarding/userNotifications/NotificationsView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/userNotifications/NotificationsView.jsx
@@ -18,89 +18,155 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import enhanceWithClickOutside from 'react-click-outside';
 import classnames from 'classnames';
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
 import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
 import Overlay from 'nfvo-components/overlay/Overlay.jsx';
 import UserNotifications from 'sdc-app/onboarding/userNotifications/UserNotifications.jsx';
 import UserNotificationsActionHelper from 'sdc-app/onboarding/userNotifications/UserNotificationsActionHelper.js';
-import {actionTypes} from './UserNotificationsConstants.js';
+import { actionTypes } from './UserNotificationsConstants.js';
 import OnboardingActionHelper from 'sdc-app/onboarding/OnboardingActionHelper.js';
 
-const mapStateToProps = ({currentScreen, notifications, users: {usersList}}) => {
-	return {currentScreen, notifications, usersList};
+const mapStateToProps = ({
+    currentScreen,
+    notifications,
+    users: { usersList }
+}) => {
+    return { currentScreen, notifications, usersList };
 };
 
-const mapActionToProps = (dispatch) => {
-	return {
-		resetNewNotifications: notificationId => UserNotificationsActionHelper.updateLastSeenNotification(dispatch, {notificationId}),
-		toggleOverlay: ({showNotificationsOverlay}) => dispatch({type: actionTypes.TOGGLE_OVERLAY, showNotificationsOverlay}),
-		onLoadPrevNotifications: (lastScanned, endOfPage) => UserNotificationsActionHelper.loadPreviousNotifications(dispatch, {lastScanned, endOfPage}),
-		onSync: ({itemId, itemName, versionId, versionName, currentScreen}) =>  UserNotificationsActionHelper.syncItem(dispatch, {itemId, itemName, versionId, versionName, currentScreen}),
-		updateNotification: notificationForUpdate => UserNotificationsActionHelper.updateNotification(dispatch, {notificationForUpdate}),
-		onLoadItemsLists: () => OnboardingActionHelper.loadItemsLists(dispatch)
-	};
+const mapActionToProps = dispatch => {
+    return {
+        resetNewNotifications: notificationId =>
+            UserNotificationsActionHelper.updateLastSeenNotification(dispatch, {
+                notificationId
+            }),
+        toggleOverlay: ({ showNotificationsOverlay }) =>
+            dispatch({
+                type: actionTypes.TOGGLE_OVERLAY,
+                showNotificationsOverlay
+            }),
+        onLoadPrevNotifications: (lastScanned, endOfPage) =>
+            UserNotificationsActionHelper.loadPreviousNotifications(dispatch, {
+                lastScanned,
+                endOfPage
+            }),
+        onSync: ({ itemId, itemName, versionId, versionName, currentScreen }) =>
+            UserNotificationsActionHelper.syncItem(dispatch, {
+                itemId,
+                itemName,
+                versionId,
+                versionName,
+                currentScreen
+            }),
+        updateNotification: notificationForUpdate =>
+            UserNotificationsActionHelper.updateNotification(dispatch, {
+                notificationForUpdate
+            }),
+        onLoadItemsLists: () => OnboardingActionHelper.loadItemsLists(dispatch)
+    };
 };
 
-
 class NotificationsView extends React.Component {
+    static propTypes = {
+        currentScreen: PropTypes.object,
+        notifications: PropTypes.object,
+        resetNewNotifications: PropTypes.func,
+        toggleOverlay: PropTypes.func,
+        onLoadPrevNotifications: PropTypes.func,
+        onSync: PropTypes.func,
+        updateNotification: PropTypes.func,
+        onLoadItemsLists: PropTypes.func
+    };
 
-	static propTypes = {
-		currentScreen: PropTypes.object,
-		notifications: PropTypes.object,
-		resetNewNotifications: PropTypes.func,
-		toggleOverlay: PropTypes.func,
-		onLoadPrevNotifications: PropTypes.func,
-		onSync: PropTypes.func,
-		updateNotification: PropTypes.func,
-		onLoadItemsLists: PropTypes.func
-	};
-
-	render() {
-		const {usersList, notifications, onLoadPrevNotifications, onSync, updateNotification, onLoadItemsLists, currentScreen} = this.props;
-		const {notificationsList, numOfNotSeenNotifications, showNotificationsOverlay, lastScanned, endOfPage} = notifications;
+    render() {
+        const {
+            usersList,
+            notifications,
+            onLoadPrevNotifications,
+            onSync,
+            updateNotification,
+            onLoadItemsLists,
+            currentScreen
+        } = this.props;
+        const {
+            notificationsList,
+            numOfNotSeenNotifications,
+            showNotificationsOverlay,
+            lastScanned,
+            endOfPage
+        } = notifications;
 
-		return (
-			<div className='onboarding-notifications'>
-				<div className='notifications-icon' onClick={() => this.onNotificationIconClick()}>
-					<SVGIcon name={numOfNotSeenNotifications > 0 ? 'notificationFullBell' : 'notificationBell'} color={numOfNotSeenNotifications > 0 ? 'primary' : ''}/>
-					<div className={classnames('notifications-count', {'hidden-count': numOfNotSeenNotifications === 0})}>
-							{numOfNotSeenNotifications}
-					</div>
-				</div>
-				{showNotificationsOverlay &&
-					<Overlay>
-						<UserNotifications notificationsList={notificationsList} usersList={usersList} lastScanned={lastScanned} endOfPage={endOfPage}
-							onLoadPrevNotifications={onLoadPrevNotifications} onSync={onSync} updateNotification={updateNotification} onLoadItemsLists={onLoadItemsLists}
-							currentScreen={currentScreen}/>
-					</Overlay>
-				}
-			</div>
-		);
-	}
+        return (
+            <div className="onboarding-notifications">
+                <div
+                    className="notifications-icon"
+                    onClick={() => this.onNotificationIconClick()}>
+                    <SVGIcon
+                        name={
+                            numOfNotSeenNotifications > 0
+                                ? 'notificationFullBell'
+                                : 'notificationBell'
+                        }
+                        color={numOfNotSeenNotifications > 0 ? 'primary' : ''}
+                    />
+                    <div
+                        className={classnames('notifications-count', {
+                            'hidden-count': numOfNotSeenNotifications === 0
+                        })}>
+                        {numOfNotSeenNotifications}
+                    </div>
+                </div>
+                {showNotificationsOverlay && (
+                    <Overlay>
+                        <UserNotifications
+                            notificationsList={notificationsList}
+                            usersList={usersList}
+                            lastScanned={lastScanned}
+                            endOfPage={endOfPage}
+                            onLoadPrevNotifications={onLoadPrevNotifications}
+                            onSync={onSync}
+                            updateNotification={updateNotification}
+                            onLoadItemsLists={onLoadItemsLists}
+                            currentScreen={currentScreen}
+                        />
+                    </Overlay>
+                )}
+            </div>
+        );
+    }
 
-	handleClickOutside() {
-		const {notifications: {showNotificationsOverlay}} = this.props;
-		if(showNotificationsOverlay) {
-			this.onCloseOverlay();
-		}
-	}
+    handleClickOutside() {
+        const { notifications: { showNotificationsOverlay } } = this.props;
+        if (showNotificationsOverlay) {
+            this.onCloseOverlay();
+        }
+    }
 
-	onNotificationIconClick() {
-		const {notifications: {showNotificationsOverlay}, toggleOverlay} = this.props;
-		if (showNotificationsOverlay) {
-			this.onCloseOverlay();
-		} else {
-			toggleOverlay({showNotificationsOverlay: true});
-		}
-	}
+    onNotificationIconClick() {
+        const {
+            notifications: { showNotificationsOverlay },
+            toggleOverlay
+        } = this.props;
+        if (showNotificationsOverlay) {
+            this.onCloseOverlay();
+        } else {
+            toggleOverlay({ showNotificationsOverlay: true });
+        }
+    }
 
-	onCloseOverlay() {
-		const {notifications: {numOfNotSeenNotifications, lastScanned}, resetNewNotifications, toggleOverlay} = this.props;
-		if (numOfNotSeenNotifications) {
-			resetNewNotifications(lastScanned);
-		}
-		toggleOverlay({showNotificationsOverlay: false});
-	}
+    onCloseOverlay() {
+        const {
+            notifications: { numOfNotSeenNotifications, lastScanned },
+            resetNewNotifications,
+            toggleOverlay
+        } = this.props;
+        if (numOfNotSeenNotifications) {
+            resetNewNotifications(lastScanned);
+        }
+        toggleOverlay({ showNotificationsOverlay: false });
+    }
 }
 
-export default connect(mapStateToProps, mapActionToProps)(enhanceWithClickOutside(NotificationsView));
+export default connect(mapStateToProps, mapActionToProps)(
+    enhanceWithClickOutside(NotificationsView)
+);