From a7b4b96afee33a2ff458f906742d88cd306ed961 Mon Sep 17 00:00:00 2001 From: Shawn Severin Date: Thu, 7 Dec 2017 15:19:25 -0500 Subject: Adding filter bar Issue-ID: AAI-543 Change-Id: I18ec69f4585a9f01feafd009fcd30493a039b064 Signed-off-by: Shawn Severin --- src/app/tierSupport/TierSupport.jsx | 108 ++++++++++++++++----- src/app/tierSupport/TierSupportActions.js | 36 +++++-- src/app/tierSupport/TierSupportConstants.js | 23 +++-- src/app/tierSupport/TierSupportReducer.js | 30 +++--- .../selectedNodeDetails/SelectedNodeDetails.jsx | 23 +++-- 5 files changed, 156 insertions(+), 64 deletions(-) (limited to 'src/app/tierSupport') diff --git a/src/app/tierSupport/TierSupport.jsx b/src/app/tierSupport/TierSupport.jsx index e6c479e..e38b43d 100644 --- a/src/app/tierSupport/TierSupport.jsx +++ b/src/app/tierSupport/TierSupport.jsx @@ -1,31 +1,40 @@ /* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. + * ============LICENSE_START=================================================== + * SPARKY (AAI UI service) + * ============================================================================ + * Copyright © 2017 AT&T Intellectual Property. * Copyright © 2017 Amdocs - * ================================================================================ + * All rights reserved. + * ============================================================================ * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * - * http://www.apache.org/licenses/LICENSE-2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. - * ============LICENSE_END========================================================= + * ============LICENSE_END===================================================== * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. + * ECOMP and OpenECOMP are trademarks + * and service marks of AT&T Intellectual Property. */ + import React, {Component} from 'react'; import {connect} from 'react-redux'; import SplitPane from 'react-split-pane'; +import {setSecondaryTitle} from 'app/MainScreenWrapperActionHelper.js'; import ForceDirectedGraph from 'generic-components/graph/ForceDirectedGraph.jsx'; import SelectedNodeDetails from 'app/tierSupport/selectedNodeDetails/SelectedNodeDetails.jsx'; + + +import overlaysDetails from 'resources/overlays/overlaysDetails.json'; +import * as Overlays from 'app/overlays/OverlayImports.js'; + import i18n from 'utils/i18n/i18n'; import { onNodeDetailsChange, @@ -39,7 +48,7 @@ import { TSUI_TITLE, TSUI_NODE_DETAILS_INITIAL_WIDTH, TSUI_NODE_DETAILS_MIN_WIDTH, - TSUI_GRAPH_MENU_NODE_DETAILS + TSUI_GRAPH_MENU_NODE_DETAILS, } from './TierSupportConstants.js'; let mapStateToProps = ( @@ -61,7 +70,8 @@ let mapStateToProps = ( windowHeight = 500, graphNodeSelectedMenu = TSUI_GRAPH_MENU_NODE_DETAILS, feedbackMsgText = '', - feedbackMsgSeverity = '' + feedbackMsgSeverity = '', + nodeData = {} } = tierSupportReducer; let { @@ -76,12 +86,16 @@ let mapStateToProps = ( performPrepareVisualization, selectedSuggestion, feedbackMsgText, - feedbackMsgSeverity + feedbackMsgSeverity, + nodeData }; }; let mapActionToProps = (dispatch) => { return { + onSetViewTitle: (title) => { + dispatch(setSecondaryTitle(title)); + }, onNodeSelected: (requestObject) => { dispatch(onNodeDetailsChange(requestObject)); }, @@ -110,7 +124,8 @@ class TierSupport extends Component { windowHeight: React.PropTypes.number, graphNodeSelectedMenu: React.PropTypes.string, feedbackMsgText: React.PropTypes.string, - feedbackMsgSeverity: React.PropTypes.string + feedbackMsgSeverity: React.PropTypes.string, + nodeData: React.PropTypes.object }; componentWillReceiveProps(nextProps) { @@ -119,6 +134,10 @@ class TierSupport extends Component { this.props.match.params.viParam) { this.props.onNewVIParam(nextProps.match.params.viParam); } + if(nextProps.match.params.viParam === undefined && nextProps.match.params.viParam !== + this.props.match.params.viParam) { + this.props.onRequestClearData(); + } if (nextProps.feedbackMsgText !== this.props.feedbackMsgText) { this.props.onMessageStateChange(nextProps.feedbackMsgText, @@ -127,6 +146,7 @@ class TierSupport extends Component { } componentWillMount() { + this.props.onSetViewTitle(i18n(TSUI_TITLE)); if (this.props.match.params.viParam) { this.props.onNewVIParam(this.props.match.params.viParam); } else { @@ -144,6 +164,7 @@ class TierSupport extends Component { } render() { + const { forceDirectedGraphRawData, onNodeSelected, @@ -152,17 +173,35 @@ class TierSupport extends Component { onSplitPaneResize, onNodeMenuSelect } = this.props; - let currentSelectedMenu = this.getCurrentSelectedMenu(); + + + let availableOverlay; + let overlayComponent; + // Currently only ONE overlay can be added to each view. + // todo: need to make it array if more than one overlay can be used. No need now. + overlaysDetails.forEach(function(overlay){ + if(overlay.view === 'schema') { + availableOverlay = overlay.key; + overlayComponent = overlay.componentName; + } + }); //Temp code for a demo, will be removed as Vis library is updated - let currentNodeButton = 'NODE_DETAILS'; + let currentNodeButton; + if(this.props.graphNodeSelectedMenu === + TSUI_GRAPH_MENU_NODE_DETAILS ) { + currentNodeButton = 'NODE_DETAILS'; + } else if(availableOverlay) { + currentNodeButton = availableOverlay; + } // End temp code - + let dataOverlayButtons = ['NODE_DETAILS']; + if(availableOverlay) { + dataOverlayButtons.push(availableOverlay); + } + let currentSelectedMenu = this.getCurrentSelectedMenu(overlayComponent); return (
-
- {i18n(TSUI_TITLE)} -
{ onNodeMenuSelect(selectedMenuId); }} + dataOverlayButtons={dataOverlayButtons} currentlySelectedNodeView={currentNodeButton}/> +
{currentSelectedMenu} @@ -194,15 +235,34 @@ class TierSupport extends Component { ); } - getCurrentSelectedMenu() { - switch (this.props.graphNodeSelectedMenu) { - case TSUI_GRAPH_MENU_NODE_DETAILS: - if (!this.nodeDetails) { - this.nodeDetails = ; + isNotEmpty(obj) { + for(var prop in obj) { + if(obj.hasOwnProperty(prop)) { + return true; + } + } + return false; + } + + getCurrentSelectedMenu(overlayComponent) { + let secondOverlay; + if (this.props.graphNodeSelectedMenu === TSUI_GRAPH_MENU_NODE_DETAILS) { + if (!this.nodeDetails) { + this.nodeDetails = ; + } + return this.nodeDetails; + } + else { + if (this.isNotEmpty(this.props.nodeData) && overlayComponent) { + if (Overlays.default.hasOwnProperty(overlayComponent)) { + let OverlayComponent = Overlays.default[overlayComponent]; + secondOverlay = ; } - return this.nodeDetails; + } + return secondOverlay; } } + } export default connect(mapStateToProps, mapActionToProps)(TierSupport); diff --git a/src/app/tierSupport/TierSupportActions.js b/src/app/tierSupport/TierSupportActions.js index 4261360..6de6ab0 100644 --- a/src/app/tierSupport/TierSupportActions.js +++ b/src/app/tierSupport/TierSupportActions.js @@ -1,26 +1,29 @@ /* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. + * ============LICENSE_START=================================================== + * SPARKY (AAI UI service) + * ============================================================================ + * Copyright © 2017 AT&T Intellectual Property. * Copyright © 2017 Amdocs - * ================================================================================ + * All rights reserved. + * ============================================================================ * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * - * http://www.apache.org/licenses/LICENSE-2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. - * ============LICENSE_END========================================================= + * ============LICENSE_END===================================================== * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. + * ECOMP and OpenECOMP are trademarks + * and service marks of AT&T Intellectual Property. */ + import {tierSupportActionTypes, TS_BACKEND_SEARCH_SELECTED_NODE_URL} from 'app/tierSupport/TierSupportConstants.js'; import { @@ -33,7 +36,7 @@ import networkCall from 'app/networking/NetworkCalls.js'; import { getSetGlobalMessageEvent, getClearGlobalMessageEvent -} from 'app/GlobalInlineMessageBar/GlobalInlineMessageBarActions.js'; +} from 'app/globalInlineMessageBar/GlobalInlineMessageBarActions.js'; import { STATUS_CODE_204_NO_CONTENT, STATUS_CODE_3XX_REDIRECTION, @@ -86,6 +89,20 @@ function createNodeDetailsFoundEvent(nodeDetails) { }; } +function createSelectedNodeDetails(nodeDetails) { + var selectedNodeDetail; + for(let i = 0; i < nodeDetails.nodes.length; i++) { + if(nodeDetails.nodes[i].nodeMeta.className === 'selectedSearchedNodeClass') { + selectedNodeDetail = nodeDetails.nodes[i]; + break; + } + } + return { + type: tierSupportActionTypes.TS_GRAPH_NODE_SELECTED, + data: selectedNodeDetail + }; +} + function noNodeDetailsFoundEvent(errorText) { return { type: tierSupportActionTypes.TS_NODE_SEARCH_NO_RESULTS, @@ -121,6 +138,7 @@ export function fetchSelectedNodeElement(fetchRequestCallback) { (responseJson) => { if (responseJson.nodes.length > 0) { dispatch(createNodeDetailsFoundEvent(responseJson)); + dispatch(createSelectedNodeDetails(responseJson)); } else { dispatch(noNodeDetailsFoundEvent(NO_RESULTS_FOUND)); } diff --git a/src/app/tierSupport/TierSupportConstants.js b/src/app/tierSupport/TierSupportConstants.js index 9383d65..1a525b1 100644 --- a/src/app/tierSupport/TierSupportConstants.js +++ b/src/app/tierSupport/TierSupportConstants.js @@ -1,25 +1,28 @@ /* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. + * ============LICENSE_START=================================================== + * SPARKY (AAI UI service) + * ============================================================================ + * Copyright © 2017 AT&T Intellectual Property. * Copyright © 2017 Amdocs - * ================================================================================ + * All rights reserved. + * ============================================================================ * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * - * http://www.apache.org/licenses/LICENSE-2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. - * ============LICENSE_END========================================================= + * ============LICENSE_END===================================================== * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. + * ECOMP and OpenECOMP are trademarks + * and service marks of AT&T Intellectual Property. */ + import keyMirror from 'utils/KeyMirror.js'; import {BASE_URL} from 'app/networking/NetworkConstants.js'; @@ -37,10 +40,10 @@ export const tierSupportActionTypes = keyMirror({ export const TSUI_NODE_DETAILS_INITIAL_WIDTH = 300; export const TSUI_NODE_DETAILS_MIN_WIDTH = 200; -export const TSUI_SEARCH_URL = BASE_URL + '/search/viuiSearch/'; +export const TSUI_SEARCH_URL = BASE_URL + '/rest/search/viuiSearch/'; export const TSUI_TITLE = 'View & Inspect'; export const TSUI_GRAPH_MENU_NODE_DETAILS = 'NODE_DETAILS'; -export const SEARCH_SELECTED_NODE_PATH = '/visualization/prepareVisualization'; +export const SEARCH_SELECTED_NODE_PATH = '/rest/visualization/prepareVisualization'; export const TS_BACKEND_SEARCH_SELECTED_NODE_URL = BASE_URL + SEARCH_SELECTED_NODE_PATH; diff --git a/src/app/tierSupport/TierSupportReducer.js b/src/app/tierSupport/TierSupportReducer.js index 3c4e83e..7dd6ab0 100644 --- a/src/app/tierSupport/TierSupportReducer.js +++ b/src/app/tierSupport/TierSupportReducer.js @@ -1,25 +1,28 @@ /* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. + * ============LICENSE_START=================================================== + * SPARKY (AAI UI service) + * ============================================================================ + * Copyright © 2017 AT&T Intellectual Property. * Copyright © 2017 Amdocs - * ================================================================================ + * All rights reserved. + * ============================================================================ * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * - * http://www.apache.org/licenses/LICENSE-2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. - * ============LICENSE_END========================================================= + * ============LICENSE_END===================================================== * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. + * ECOMP and OpenECOMP are trademarks + * and service marks of AT&T Intellectual Property. */ + import {combineReducers} from 'redux'; import ForceDirectedGraph from 'generic-components/graph/ForceDirectedGraph.jsx'; import {aaiActionTypes} from 'app/MainScreenWrapperConstants.js'; @@ -43,7 +46,7 @@ export default combineReducers({ case tierSupportActionTypes.TS_NODE_SEARCH_RESULTS: let graphData = ForceDirectedGraph.generateNewProps(action.data.nodes, action.data.links, action.data.graphMeta); - + return { ...state, forceDirectedGraphRawData: graphData, @@ -81,6 +84,11 @@ export default combineReducers({ feedbackMsgText: '', feedbackMsgSeverity: '' }; + case tierSupportActionTypes.TS_GRAPH_NODE_SELECTED: + return { + ...state, + nodeData: action.data + }; case globalAutoCompleteSearchBarActionTypes.SEARCH_WARNING_EVENT: let emptyNodesAndLinksWarningEvent = ForceDirectedGraph.generateNewProps([], [], {}); return { @@ -93,7 +101,7 @@ export default combineReducers({ let splitPaneLeftSideElement = document.getElementsByClassName('Pane1'); if (splitPaneLeftSideElement.length > 0) { let width = splitPaneLeftSideElement[0].offsetWidth; - + return { ...state, windowWidth: width, windowHeight: splitPaneLeftSideElement[0].offsetHeight }; @@ -101,7 +109,7 @@ export default combineReducers({ return state; } } - + return state; } }); diff --git a/src/app/tierSupport/selectedNodeDetails/SelectedNodeDetails.jsx b/src/app/tierSupport/selectedNodeDetails/SelectedNodeDetails.jsx index 97fa4ec..267a1c3 100644 --- a/src/app/tierSupport/selectedNodeDetails/SelectedNodeDetails.jsx +++ b/src/app/tierSupport/selectedNodeDetails/SelectedNodeDetails.jsx @@ -1,25 +1,28 @@ /* - * ============LICENSE_START======================================================= - * org.onap.aai - * ================================================================================ - * Copyright © 2017 AT&T Intellectual Property. All rights reserved. + * ============LICENSE_START=================================================== + * SPARKY (AAI UI service) + * ============================================================================ + * Copyright © 2017 AT&T Intellectual Property. * Copyright © 2017 Amdocs - * ================================================================================ + * All rights reserved. + * ============================================================================ * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * - * http://www.apache.org/licenses/LICENSE-2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. - * ============LICENSE_END========================================================= + * ============LICENSE_END===================================================== * - * ECOMP is a trademark and service mark of AT&T Intellectual Property. + * ECOMP and OpenECOMP are trademarks + * and service marks of AT&T Intellectual Property. */ + import {connect} from 'react-redux'; import React, {Component} from 'react'; import Table from 'react-bootstrap/lib/Table'; @@ -31,7 +34,7 @@ import { } from 'app/tierSupport/selectedNodeDetails/SelectedNodeDetailsConstants.js'; let mapStateToProps = ({tierSupport: {selectedNodeDetails}}) => { - let {nodeData = [], nodeType = '', uid = ''} = selectedNodeDetails; + let {nodeData = {}, nodeType = '', uid = ''} = selectedNodeDetails; return { nodeData, @@ -42,7 +45,7 @@ let mapStateToProps = ({tierSupport: {selectedNodeDetails}}) => { class SelectedNodeDetails extends Component { static propTypes = { - nodeData: React.PropTypes.array, + nodeData: React.PropTypes.object, nodeType: React.PropTypes.string, uid: React.PropTypes.string }; -- cgit 1.2.3-korg