openecomp-ui/src/nfvo-components/input/validation/ValidationTab.jsx

   1 import React from 'react';
   2 import Tab from 'react-bootstrap/lib/Tab.js';
   3
   4 export default
   5 class ValidationTab extends React.Component {
   6
   7         static propTypes = {
   8                 children: React.PropTypes.node,
   9                 eventKey: React.PropTypes.any.isRequired,
  10                 onValidationStateChange: React.PropTypes.func //This property is assigned dynamically via React.cloneElement. lookup ValidationTabs.jsx. therefore it cannot be stated as required!
  11         };
  12
  13         constructor(props) {
  14                 super(props);
  15                 this.validationComponents = [];
  16         }
  17
  18         static childContextTypes = {
  19                 validationParent: React.PropTypes.any
  20         };
  21
  22         static contextTypes = {
  23                 validationParent: React.PropTypes.any
  24         };
  25
  26         getChildContext() {
  27                 return {validationParent: this};
  28         }
  29
  30         state = {
  31                 isValid: true,
  32                 notifyParent: false
  33         };
  34
  35         componentDidMount() {
  36                 let validationParent = this.context.validationParent;
  37                 if (validationParent) {
  38                         validationParent.register(this);
  39                 }
  40         }
  41
  42         componentWillUnmount() {
  43                 let validationParent = this.context.validationParent;
  44                 if (validationParent) {
  45                         validationParent.unregister(this);
  46                 }
  47         }
  48
  49         register(validationComponent) {
  50                 this.validationComponents.push(validationComponent);
  51         }
  52
  53         unregister(validationComponent) {
  54                 this.childValidStateChanged(validationComponent, true);
  55                 this.validationComponents = this.validationComponents.filter(otherValidationComponent => validationComponent !== otherValidationComponent);
  56         }
  57
  58         notifyValidStateChangedToParent(isValid) {
  59
  60                 let validationParent = this.context.validationParent;
  61                 if (validationParent) {
  62                         validationParent.childValidStateChanged(this, isValid);
  63                 }
  64         }
  65
  66         childValidStateChanged(validationComponent, isValid) {
  67
  68                 const currentValidState = this.state.isValid;
  69                 if (isValid !== currentValidState) {
  70                         let filteredValidationComponents = this.validationComponents.filter(otherValidationComponent => validationComponent !== otherValidationComponent);
  71                         let newValidState = isValid && filteredValidationComponents.every(otherValidationComponent => {
  72                                 return otherValidationComponent.isValid();
  73                         });
  74                         this.setState({isValid: newValidState, notifyParent: true});
  75                 }
  76         }
  77
  78         validate() {
  79                 let isValid = true;
  80                 this.validationComponents.forEach(validationComponent => {
  81                         const isValidationComponentValid = validationComponent.validate().isValid;
  82                         isValid = isValidationComponentValid && isValid;
  83                 });
  84                 this.setState({isValid, notifyParent: false});
  85                 return {isValid};
  86         }
  87
  88         componentDidUpdate(prevProps, prevState) {
  89                 if(prevState.isValid !== this.state.isValid) {
  90                         if(this.state.notifyParent) {
  91                                 this.notifyValidStateChangedToParent(this.state.isValid);
  92                         }
  93                         this.props.onValidationStateChange(this.props.eventKey, this.state.isValid);
  94                 }
  95         }
  96
  97         isValid() {
  98                 return this.state.isValid;
  99         }
 100
 101         render() {
 102                 let {children, ...tabProps} = this.props;
 103                 return (
 104                         <Tab {...tabProps}>{children}</Tab>
 105                 );
 106         }
 107 }