openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx

   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  */
  16 import React from 'react';
  17 import PropTypes from 'prop-types';
  18
  19 import i18n from 'nfvo-utils/i18n/i18n.js';
  20 import Form from 'nfvo-components/input/validation/Form.jsx';
  21
  22 import FileDetails from './imagesEditorComponents/FileDetails.jsx';
  23 import ImageDetails from './imagesEditorComponents/ImageDetails.jsx';
  24 import {imageCustomValidations} from './ImageValidations.js';
  25
  26 class SoftwareProductComponentsImageEditorView extends React.Component {
  27         static propTypes = {
  28                 onDataChanged: PropTypes.func.isRequired,
  29                 onSubmit: PropTypes.func.isRequired,
  30                 onCancel: PropTypes.func.isRequired
  31         };
  32
  33         render() {
  34                 let {onCancel, onValidateForm, isReadOnlyMode, isFormValid, formReady, data = {}, genericFieldInfo, qgenericFieldInfo, dataMap, onDataChanged, isManual, onQDataChanged} = this.props;
  35                 let {id, fileName} = data;
  36                 let editingMode = Boolean(id);
  37                 return (
  38                         <div>
  39                                 {genericFieldInfo && <Form
  40                                         ref={(form) => { this.form = form; }}
  41                                         hasButtons={true}
  42                                         onSubmit={ () => this.submit() }
  43                                         onReset={ () => onCancel() }
  44                                         labledButtons={true}
  45                                         isReadOnlyMode={isReadOnlyMode}
  46                                         isValid={isFormValid}
  47                                         formReady={formReady}
  48                                         submitButtonText={editingMode ? i18n('Save') : i18n('Create')}
  49                                         onValidateForm={() => onValidateForm(imageCustomValidations) }
  50                                         className='vsp-components-image-editor'>
  51                                         <div className='editor-data'>
  52                                                 <FileDetails
  53                                                         editingMode={editingMode}
  54                                                         genericFieldInfo={genericFieldInfo}
  55                                                         qgenericFieldInfo={qgenericFieldInfo}
  56                                                         fileName={fileName}
  57                                                         onDataChanged={onDataChanged}
  58                                                         isManual={isManual}
  59                                                         dataMap={dataMap}
  60                                                         onQDataChanged={onQDataChanged}/>
  61                                                 {editingMode && <ImageDetails dataMap={dataMap} qgenericFieldInfo={qgenericFieldInfo} onQDataChanged={onQDataChanged}/>}
  62                                         </div>
  63                                 </Form>}
  64                         </div>
  65                 );
  66         }
  67         submit() {
  68                 let {data, qdata, onSubmit, version} = this.props;
  69                 onSubmit({data, qdata, version});
  70         }
  71 }
  72
  73 export default SoftwareProductComponentsImageEditorView;