X-Git-Url: https://gerrit.onap.org/r/gitweb?p=aai%2Fsparky-fe.git;a=blobdiff_plain;f=src%2Fapp%2FMainScreenHeader.jsx;h=14d6bf2fa40d47425306ba72eb8c3c997eaaa869;hp=49952f7fc76126122bda472be5892da93923f9ae;hb=HEAD;hpb=a38f3d6bb17a478d08016e49d6c2a667ac483d4a diff --git a/src/app/MainScreenHeader.jsx b/src/app/MainScreenHeader.jsx index 49952f7..14d6bf2 100644 --- a/src/app/MainScreenHeader.jsx +++ b/src/app/MainScreenHeader.jsx @@ -2,8 +2,8 @@ * ============LICENSE_START======================================================= * org.onap.aai * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. - * Copyright © 2017 Amdocs + * Copyright © 2017-2018 AT&T Intellectual Property. All rights reserved. + * Copyright © 2017-2018 Amdocs * ================================================================================ * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -17,24 +17,26 @@ * See the License for the specific language governing permissions and * limitations under the License. * ============LICENSE_END========================================================= - * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. */ - import React, {Component} from 'react'; +import { PropTypes } from 'prop-types'; import {connect} from 'react-redux'; import FontAwesome from 'react-fontawesome'; import {clearFilters} from 'filter-bar-utils'; import Button from 'react-bootstrap/lib/Button.js'; import Modal from 'react-bootstrap/lib/Modal.js'; -import GlobalAutoCompleteSearchBar from 'app/globalAutoCompleteSearchBar/GlobalAutoCompleteSearchBar.jsx'; -import {postAnalyticsData} from 'app/analytics/AnalyticsActions.js'; +import {postAnalyticsData, getStoreAnalyticsPayload} from 'app/analytics/AnalyticsActions.js'; import GlobalInlineMessageBar from 'app/globalInlineMessageBar/GlobalInlineMessageBar.jsx'; import {getClearGlobalMessageEvent} from 'app/globalInlineMessageBar/GlobalInlineMessageBarActions.js'; import {externalUrlRequest, externalMessageRequest, getSubscriptionPayload} from 'app/contextHandler/ContextHandlerActions.js'; +import { getConfigurableViewConfigs } from 'app/configurableViews/ConfigurableViewActions.js'; +import {GlobalExtConstants} from 'utils/GlobalExtConstants.js'; +import axios from 'axios'; +import {BASE_URL} from 'app/networking/NetworkConstants.js'; import { - filterBarActionTypes + filterBarActionTypes, + ENVIRONMENT } from 'utils/GlobalConstants.js'; import { @@ -43,9 +45,10 @@ import { } from 'react-router-dom'; import { - AAI_TITLE, - MENU_ITEM_TIER_SUPPORT, - MENU_ITEM_VNF_SEARCH + AAI_TOP_LEFT_HEADER, + AAI_HTML_TITLE, + AAI_APERTURE_SERVICE, + AAI_LOADTEMPLATE_MAX_COUNT } from './MainScreenWrapperConstants.js'; import { @@ -56,26 +59,43 @@ import { import {clearSuggestionsTextField} from 'app/globalAutoCompleteSearchBar/GlobalAutoCompleteSearchBarActions.js'; import {changeUrlAddress} from 'utils/Routes.js'; -import extensibleViews from 'resources/views/extensibleViews.json'; +import defaultViews from 'resources/views/defaultViews.json'; +import defaultViews_onap from 'resources/views/defaultViews_onap.json'; +import {getPersonalizationDetails} from 'app/personlaization/PersonalizationActions.js'; +import {isEmpty} from 'lodash'; +let INVLIST = GlobalExtConstants.INVLIST; -const mapStateToProps = ({mainWrapper}) => { +const mapStateToProps = ({mainWrapper, configurableViews}) => { let { showMenu = false, toggleButtonActive = false, externalRequestFound = {}, secondaryTitle = '', subscriptionPayload = {}, - subscriptionEnabled = false + subscriptionEnabled = false, + aaiTopLeftPersonalizedHeader = AAI_TOP_LEFT_HEADER, + aaiPersonalizedHtmlDocumentTitle = AAI_HTML_TITLE, + aaiPersonalizedApertureService = AAI_APERTURE_SERVICE, + aaiPersonalizedLoadTemplateMaxCount = AAI_LOADTEMPLATE_MAX_COUNT } = mainWrapper; + let { + configurableViewsConfig + } = configurableViews; + return { showMenu, toggleButtonActive, externalRequestFound, secondaryTitle, subscriptionPayload, - subscriptionEnabled + subscriptionEnabled, + configurableViewsConfig, + aaiTopLeftPersonalizedHeader, + aaiPersonalizedHtmlDocumentTitle, + aaiPersonalizedApertureService, + aaiPersonalizedLoadTemplateMaxCount }; }; @@ -87,7 +107,7 @@ const mapActionsToProps = (dispatch) => { dispatch(showMainMenu(false)); }, dispatchAnalyticsData: () => dispatch( - postAnalyticsData(document.documentElement.outerHTML.replace('\s+', ''))), + postAnalyticsData(getStoreAnalyticsPayload())), onRouteChange: () => { dispatch(getClearGlobalMessageEvent()); dispatch(clearSuggestionsTextField()); @@ -103,17 +123,27 @@ const mapActionsToProps = (dispatch) => { }, onGetSubscriptionPayload: () => { dispatch(getSubscriptionPayload()); + }, + onFetchCustomViews: () => { + dispatch(getConfigurableViewConfigs()); + }, + onGetPersonalizationValues: () => { + dispatch(getPersonalizationDetails()); } }; }; class MainScreenHeader extends Component { static propTypes = { - showMenu: React.PropTypes.bool, - toggleButtonActive: React.PropTypes.bool, - externalRequestFound: React.PropTypes.object, - secondaryTitle: React.PropTypes.string, - subscriptionPayload: React.PropTypes.object + showMenu: PropTypes.bool, + toggleButtonActive: PropTypes.bool, + externalRequestFound: PropTypes.object, + secondaryTitle: PropTypes.string, + subscriptionPayload: PropTypes.object, + aaiTopLeftPersonalizedHeader: PropTypes.string, + aaiPersonalizedHtmlDocumentTitle: PropTypes.string, + aaiPersonalizedApertureService: PropTypes.bool, + aaiPersonalizedLoadTemplateMaxCount: PropTypes.string }; navigationLinkAndCurrentPathMatch(location, to) { @@ -135,6 +165,7 @@ class MainScreenHeader extends Component { return false; } } + isValidExternalURL(url) { if(decodeURIComponent(url).indexOf('&') > 0 ) { return true; @@ -142,14 +173,75 @@ class MainScreenHeader extends Component { return false; } } + componentWillMount() { + this.props.onGetPersonalizationValues(); this.props.onGetSubscriptionPayload(); if(this.props.match.params.externalUrl !== undefined && this.isValidExternalURL(this.props.match.params.externalUrl)) { this.props.onExternalUrlRequest(this.props.match.params.externalUrl); } + sessionStorage.setItem(ENVIRONMENT + 'ENABLE_ANALYSIS', !INVLIST.IS_ONAP); + var portalInfoPath = BASE_URL + '/portal/info'; + //portalInfoPath = 'https://localhost:8000/portal/info'; + axios.get(portalInfoPath).then(res => { + console.log('res:' + res.data); + var roles = []; + if(res.status === 200){ + if(res.data.status && (res.data.status !== '200')){ + this.setDefaultCredentials(res.data); + }else{ + sessionStorage.setItem(ENVIRONMENT + 'userId', res.data.attuid); + for(var i = 0; i < res.data.role.length; i++){ + roles.push(res.data.role[i].name); + } + sessionStorage.setItem(ENVIRONMENT + 'roles', roles); + } + }else{ + this.setDefaultCredentials(res.data); + } + }, error=>{ + this.setDefaultCredentials(error); + }).catch(error => { + this.setDefaultCredentials(error); + }); } + + setDefaultCredentials = (error) =>{ + console.log('MainScreenHeader.jsx :: Issue retrieving portal info from sparky backend, setting default, details - ' + JSON.stringify(error)); + sessionStorage.setItem(ENVIRONMENT + 'userId', 'default_uid'); + var roles = ['ui_view']; + sessionStorage.setItem(ENVIRONMENT + 'roles', roles); + } + componentWillReceiveProps(nextProps) { + if(!isEmpty(nextProps.aaiPersonalizedHtmlDocumentTitle)) { + if(!sessionStorage.getItem(ENVIRONMENT + 'PAGE_TITLE') || sessionStorage.getItem(ENVIRONMENT + 'PAGE_TITLE') !== nextProps.aaiPersonalizedHtmlDocumentTitle) { + sessionStorage.setItem(ENVIRONMENT + 'PAGE_TITLE', nextProps.aaiPersonalizedHtmlDocumentTitle); + } + document.title = nextProps.aaiPersonalizedHtmlDocumentTitle; + } else { + document.title = AAI_HTML_TITLE; + } + //Added for APERTURE Service Enable/Disable + if(!sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE') || JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE')) !== nextProps.aaiPersonalizedApertureService) { + if(JSON.parse(sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE')) !== nextProps.aaiPersonalizedApertureService){ + sessionStorage.setItem(ENVIRONMENT + 'APERTURE_SERVICE', Boolean(nextProps.aaiPersonalizedApertureService)); + if(nextProps.aaiPersonalizedApertureService){ + sessionStorage.setItem(ENVIRONMENT + 'ENABLE_ANALYSIS', true); + }else{ + sessionStorage.setItem(ENVIRONMENT + 'ENABLE_ANALYSIS', false); + } + }else{ + sessionStorage.setItem(ENVIRONMENT + 'APERTURE_SERVICE', Boolean(nextProps.aaiPersonalizedApertureService)); + } + } + if(!sessionStorage.getItem(ENVIRONMENT + 'APERTURE_SERVICE')){ + sessionStorage.setItem(ENVIRONMENT + 'ENABLE_ANALYSIS', false); + } + if(!sessionStorage.getItem(ENVIRONMENT + 'LOADTEMPLATE_MAX_COUNT') || sessionStorage.getItem(ENVIRONMENT + 'LOADTEMPLATE_MAX_COUNT') !== nextProps.aaiPersonalizedLoadTemplateMaxCount) { + sessionStorage.setItem(ENVIRONMENT + 'LOADTEMPLATE_MAX_COUNT', nextProps.aaiPersonalizedLoadTemplateMaxCount); + } if (this.props.location && this.props.location.pathname !== nextProps.location.pathname) { @@ -168,7 +260,7 @@ class MainScreenHeader extends Component { this.props.onExternalUrlRequest(nextProps.match.params.externalUrl); } /* if the externalURL is not valid, we do not add any message as other proper - views will get that messages since the route will be this parameter.*/ + views will get that messages since the route will be this parameter.*/ if(this.props.externalRequestFound !== nextProps.externalRequestFound && nextProps.externalRequestFound !== undefined && nextProps.externalRequestFound.suggestion !== undefined) { @@ -216,14 +308,17 @@ class MainScreenHeader extends Component { $this.receiveMessage(e, $this); }, false); } + + // fetch custom views + this.props.onFetchCustomViews(); } + componentWillUnmount() { if(this.props.subscriptionEnabled) { var $this = this; window.removeEventListener('message', function (e) { $this.receiveMessage(e, $this); - } - ); + }); } } @@ -233,7 +328,9 @@ class MainScreenHeader extends Component { onShowMenu, onHideMenu, toggleButtonActive, - secondaryTitle + secondaryTitle, + configurableViewsConfig, + aaiTopLeftPersonalizedHeader } = this.props; let menuOptions = []; @@ -249,27 +346,47 @@ class MainScreenHeader extends Component { )}/> ); - // add Tier Support view - menuOptions.push( - + const ConfigurableMenuItem = ({label, to}) => ( + ( + +
+
+
{label}
+
+ + )}/> ); - // add VNF view - menuOptions.push( - - ); + let dv = defaultViews; + if(INVLIST.IS_ONAP){ + dv = defaultViews_onap; + } + + // add all default view menu options + for (let view in dv) { + let shouldDisplayIcon = false; + if(dv[view]['onlyRoute'] === undefined){ + shouldDisplayIcon = true; + } else if(dv[view]['onlyRoute'] === false){ + shouldDisplayIcon = true; + } + if(shouldDisplayIcon === true){ + menuOptions.push( + + ); + } + } - // add all custom view menu options - for (let view in extensibleViews) { - menuOptions.push( - - ); + if (configurableViewsConfig && configurableViewsConfig.layouts) { + for (let configurableView in configurableViewsConfig.layouts) { + menuOptions.push( + + ); + } } let secondaryTitleClass = 'secondary-header'; @@ -282,8 +399,8 @@ class MainScreenHeader extends Component {
@@ -293,8 +410,7 @@ class MainScreenHeader extends Component { {menuOptions} - {AAI_TITLE} - + {aaiTopLeftPersonalizedHeader}