skyquake/plugins/launchpad/src/topologyL2View/detailView.jsx

   1 /*
   2  *
   3  *   Copyright 2016 RIFT.IO Inc
   4  *
   5  *   Licensed under the Apache License, Version 2.0 (the "License");
   6  *   you may not use this file except in compliance with the License.
   7  *   You may obtain a copy of the License at
   8  *
   9  *       http://www.apache.org/licenses/LICENSE-2.0
  10  *
  11  *   Unless required by applicable law or agreed to in writing, software
  12  *   distributed under the License is distributed on an "AS IS" BASIS,
  13  *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14  *   See the License for the specific language governing permissions and
  15  *   limitations under the License.
  16  *
  17  */
  18 import React from 'react';
  19 import LoadingIndicator from 'widgets/loading-indicator/loadingIndicator.jsx';
  20 import DashboardCard from 'widgets/dashboard_card/dashboard_card.jsx';
  21 import Listy from 'widgets/listy/listy.js';
  22
  23 import _ from 'underscore';
  24
  25 export default class TopologyDetail extends React.Component {
  26     constructor(props) {
  27         super(props);
  28     }
  29
  30     detailData(data) {
  31         if (_.isEmpty(data)) {
  32             return {};
  33         } else {
  34             return {
  35                 name: data['name'],
  36                 full_name: data['full_name'],
  37                 network: data['network'],
  38                 attr: data['attr']
  39             }
  40         }
  41     }
  42
  43     rawDetails(data) {
  44         let text = JSON.stringify(data, undefined, 2);
  45         if (text == "{}") {
  46             return false;
  47         } else {
  48             return (
  49                 <div className="topologyDebugRawJSON">
  50                     <h2>Raw JSON</h2>
  51                     <pre className="language.js">{text}</pre>
  52                 </div>
  53             );
  54         }
  55     }
  56
  57     render() {
  58         return (
  59             <DashboardCard showHeader={true} title="Record Details" className={'recordDetails'}>
  60               <div className="nodeAttr">
  61                 <Listy data={this.detailData(this.props.data)}
  62                        noDataMessage={"Select a node"}
  63                        debugMode={this.props.debugMode}
  64                 />
  65               </div>
  66               {
  67                 (this.props.debugMode)
  68                     ? this.rawDetails(this.props.data)
  69                     : false
  70               }
  71             </DashboardCard>
  72         );
  73     }
  74 }
  75
  76 TopologyDetail.propTypes = {
  77     debugMode: React.PropTypes.bool
  78 }
  79
  80 TopologyDetail.defaultProps = {
  81     data: {},
  82     debugMode: false
  83 }