AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 1 | /*! |
| 2 | * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. |
| 3 | * |
| 4 | * Licensed under the Apache License, Version 2.0 (the "License"); |
| 5 | * you may not use this file except in compliance with the License. |
| 6 | * You may obtain a copy of the License at |
| 7 | * |
| 8 | * http://www.apache.org/licenses/LICENSE-2.0 |
| 9 | * |
| 10 | * Unless required by applicable law or agreed to in writing, software |
| 11 | * distributed under the License is distributed on an "AS IS" BASIS, |
| 12 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express |
| 13 | * or implied. See the License for the specific language governing |
| 14 | * permissions and limitations under the License. |
| 15 | */ |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 16 | import React, {Component} from 'react'; |
| 17 | import ListGroupItem from 'react-bootstrap/lib/ListGroupItem.js'; |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 18 | import i18n from 'nfvo-utils/i18n/i18n.js'; |
Avi Ziv | b8e2faf | 2017-07-18 19:45:38 +0300 | [diff] [blame] | 19 | import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 20 | import {Collapse} from 'react-bootstrap'; |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 21 | /** |
| 22 | * parsing and showing the following Java Response object |
| 23 | * |
| 24 | * public class ValidationResponse { |
| 25 | private boolean valid = true; |
| 26 | private Collection<ErrorCode> vspErrors; |
| 27 | private Collection<ErrorCode> licensingDataErrors; |
| 28 | private Map<String, List<ErrorMessage>> uploadDataErrors; |
| 29 | private Map<String, List<ErrorMessage>> compilationErrors; |
| 30 | private QuestionnaireValidationResult questionnaireValidationResult; |
| 31 | } |
| 32 | |
| 33 | * public class ErrorCode { |
| 34 | private String id; |
| 35 | private String message; |
| 36 | private ErrorCategory category; |
| 37 | } |
| 38 | |
| 39 | * public class ErrorMessage { |
| 40 | private final ErrorLevel level; |
| 41 | private final String message; |
| 42 | } |
| 43 | */ |
| 44 | class SubmitErrorResponse extends Component { |
| 45 | |
| 46 | |
| 47 | render() { |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 48 | let {validationResponse : {vspErrors, licensingDataErrors, questionnaireValidationResult, uploadDataErrors}} = this.props; |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 49 | return ( |
| 50 | <div className='submit-error-response-view'> |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 51 | {vspErrors && this.renderVspErrors(vspErrors)} |
| 52 | {licensingDataErrors && this.renderVspErrors(licensingDataErrors)} |
| 53 | {questionnaireValidationResult && this.renderComponentsErrors(questionnaireValidationResult)} |
| 54 | {uploadDataErrors && this.renderUploadDataErrors(uploadDataErrors)} |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 55 | </div> |
| 56 | ); |
| 57 | } |
| 58 | |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 59 | renderVspErrors(errors) { |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 60 | return ( |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 61 | <ErrorBlock errorType={i18n('VSP Errors')}> |
| 62 | <div> |
| 63 | {errors.length && errors.map(error=>{return (<ErrorMessage error={error.message}/>);})} |
| 64 | </div> |
| 65 | </ErrorBlock> |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 66 | ); |
| 67 | } |
| 68 | |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 69 | |
| 70 | renderComponentsErrors(errors) { |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 71 | return ( |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 72 | <ErrorBlock errorType={i18n('Components Errors')}> |
| 73 | <div> |
| 74 | {errors.validationData.length && errors.validationData.map(item =>{ return (<ComponentError item={item}/>);})} |
| 75 | </div> |
| 76 | </ErrorBlock> |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 77 | ); |
| 78 | } |
| 79 | |
| 80 | renderUploadDataErrors(uploadDataErrors) { |
| 81 | return ( |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 82 | <ErrorBlock errorType={i18n('Upload Data Errors')}> |
| 83 | <div> |
| 84 | <UploadErrorList items={uploadDataErrors}/> |
| 85 | </div> |
| 86 | </ErrorBlock> |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 87 | ); |
| 88 | } |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 89 | } |
| 90 | |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 91 | |
| 92 | const ComponentError = ({item}) => { |
| 93 | let i = 0; |
| 94 | return ( |
| 95 | <div> |
| 96 | <div className='component-name-header'>{item.entityName}</div> |
| 97 | {item.errors.map(error => {return(<ErrorMessage key={i++} error={error}/>);})} |
| 98 | </div> |
| 99 | ); |
| 100 | }; |
| 101 | |
| 102 | function* entries(obj) { |
| 103 | for (let key of Object.keys(obj)) { |
| 104 | yield {header: key, list: obj[key]}; |
| 105 | } |
| 106 | } |
| 107 | |
| 108 | const UploadErrorList = ({items}) => { |
| 109 | let generator = entries(items); |
| 110 | |
| 111 | let errors = []; |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 112 | for (let item of generator) {errors.push( |
| 113 | <div> |
| 114 | <div className='component-name-header'>{item.header}</div> |
SVISHNEV | 3779f90 | 2017-08-30 16:09:04 +0300 | [diff] [blame] | 115 | {item.list.map((error, i) => <ErrorMessage key={i} warning={error.level === 'WARNING'} error={error.message}/> )} |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 116 | </div> |
| 117 | );} |
SVISHNEV | 3779f90 | 2017-08-30 16:09:04 +0300 | [diff] [blame] | 118 | |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 119 | return ( |
| 120 | <div> |
| 121 | {errors} |
| 122 | </div> |
| 123 | ); |
| 124 | }; |
| 125 | |
| 126 | class ErrorBlock extends React.Component { |
| 127 | state = { |
| 128 | collapsed: false |
| 129 | }; |
| 130 | |
| 131 | render() { |
| 132 | let {errorType, children} = this.props; |
| 133 | return ( |
| 134 | <div className='error-block'> |
| 135 | <ErrorHeader collapsed={this.state.collapsed} onClick={()=>{this.setState({collapsed: !this.state.collapsed});}} errorType={errorType}/> |
| 136 | <Collapse in={this.state.collapsed}> |
| 137 | {children} |
| 138 | </Collapse> |
| 139 | </div> |
| 140 | ); |
| 141 | } |
| 142 | } |
| 143 | |
| 144 | const ErrorHeader = ({errorType, collapsed, onClick}) => { |
| 145 | return( |
| 146 | <div onClick={onClick} className='error-block-header'> |
az2497 | 644017c | 2017-08-10 17:49:40 +0300 | [diff] [blame] | 147 | <SVGIcon iconClassName={collapsed ? '' : 'collapse-right' } name='chevronDown' label={errorType} labelPosition='right'/> |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 148 | </div> |
| 149 | ); |
| 150 | }; |
| 151 | |
| 152 | const ErrorMessage = ({error, warning}) => { |
| 153 | return ( |
| 154 | <ListGroupItem className='error-code-list-item'> |
SVISHNEV | 3779f90 | 2017-08-30 16:09:04 +0300 | [diff] [blame] | 155 | <SVGIcon |
| 156 | name={warning ? 'exclamationTriangleLine' : 'error'} |
| 157 | color={warning ? 'warning' : 'negative'} /> |
| 158 | <span className='icon-label'>{error}</span> |
AviZi | 280f801 | 2017-06-09 02:39:56 +0300 | [diff] [blame] | 159 | </ListGroupItem> |
| 160 | ); |
| 161 | }; |
| 162 | |
Michael Lando | efa037d | 2017-02-19 12:57:33 +0200 | [diff] [blame] | 163 | export default SubmitErrorResponse; |