From 7fdf733a64670fceefc3ded35cfa581e1c458179 Mon Sep 17 00:00:00 2001 From: Einav Weiss Keidar Date: Tue, 20 Mar 2018 14:45:40 +0200 Subject: Adding Prettier and fixing up eslint version Issue-ID: SDC-1094 Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd Signed-off-by: Einav Weiss Keidar --- .../details/SoftwareProductDetailsView.jsx | 993 +++++++++++++-------- 1 file changed, 604 insertions(+), 389 deletions(-) (limited to 'openecomp-ui/src/sdc-app/onboarding/softwareProduct/details/SoftwareProductDetailsView.jsx') diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/details/SoftwareProductDetailsView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/details/SoftwareProductDetailsView.jsx index 24aa319c24..12b1eadc86 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/details/SoftwareProductDetailsView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/details/SoftwareProductDetailsView.jsx @@ -13,7 +13,7 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import React, {Component} from 'react'; +import React, { Component } from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -24,427 +24,642 @@ import InputOptions from 'nfvo-components/input/validation/InputOptions.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; import SoftwareProductCategoriesHelper from 'sdc-app/onboarding/softwareProduct/SoftwareProductCategoriesHelper.js'; -import {forms} from 'sdc-app/onboarding/softwareProduct/SoftwareProductConstants.js'; +import { forms } from 'sdc-app/onboarding/softwareProduct/SoftwareProductConstants.js'; -const DeprecatedVlmInfo = ({vendorName, onVendorRemove}) => { - return ( -
- onVendorRemove()} - label={i18n('Vendor')} - type='select' - value={`${vendorName} (Archived)`}> - - -
- ); +const DeprecatedVlmInfo = ({ vendorName, onVendorRemove }) => { + return ( +
+ onVendorRemove()} + label={i18n('Vendor')} + type="select" + value={`${vendorName} (Archived)`}> + + +
+ ); }; class GeneralSection extends React.Component { - static propTypes = { - vendorId: PropTypes.string, - name: PropTypes.string, - description: PropTypes.string, - subCategory: PropTypes.string, - softwareProductCategories: PropTypes.array, - finalizedLicenseModelList: PropTypes.array, - onDataChanged: PropTypes.func.isRequired, - onVendorParamChanged: PropTypes.func.isRequired, - onSelectSubCategory: PropTypes.func.isRequired, - isVendorArchived: PropTypes.bool, - onArchivedVendorRemove: PropTypes.func - }; + static propTypes = { + vendorId: PropTypes.string, + name: PropTypes.string, + description: PropTypes.string, + subCategory: PropTypes.string, + softwareProductCategories: PropTypes.array, + finalizedLicenseModelList: PropTypes.array, + onDataChanged: PropTypes.func.isRequired, + onVendorParamChanged: PropTypes.func.isRequired, + onSelectSubCategory: PropTypes.func.isRequired, + isVendorArchived: PropTypes.bool, + onArchivedVendorRemove: PropTypes.func + }; - onVendorParamChanged(e) { - const selectedIndex = e.target.selectedIndex; - const vendorId = e.target.options[selectedIndex].value; - this.props.onVendorParamChanged({vendorId}, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS); + onVendorParamChanged(e) { + const selectedIndex = e.target.selectedIndex; + const vendorId = e.target.options[selectedIndex].value; + this.props.onVendorParamChanged( + { vendorId }, + forms.VENDOR_SOFTWARE_PRODUCT_DETAILS + ); + } - } + onSelectSubCategory(e) { + const selectedIndex = e.target.selectedIndex; + const subCategory = e.target.options[selectedIndex].value; + this.props.onSelectSubCategory(subCategory); + } + onVendorRemove() { + const { + finalizedLicenseModelList, + vendorName, + onVendorParamChanged + } = this.props; + this.props.onArchivedVendorRemove({ + finalizedLicenseModelList, + onVendorParamChanged, + vendorName + }); + } - onSelectSubCategory(e) { - const selectedIndex = e.target.selectedIndex; - const subCategory = e.target.options[selectedIndex].value; - this.props.onSelectSubCategory(subCategory); - } - onVendorRemove() { - const {finalizedLicenseModelList, vendorName, onVendorParamChanged} = this.props; - this.props.onArchivedVendorRemove({finalizedLicenseModelList, onVendorParamChanged, vendorName}); - } - - render (){ - let {genericFieldInfo} = this.props; - return ( -
- {genericFieldInfo && - - name.length <= 25 && this.props.onDataChanged({name}, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS)}/> - {this.props.isVendorArchived ? - this.onVendorRemove()} vendorName={this.props.vendorName} /> : - this.onVendorParamChanged(e)}> - {sortByStringProperty( - this.props.finalizedLicenseModelList, - 'name' - ).map(lm => ) - } - - } - this.onSelectSubCategory(e)}> - { - this.props.softwareProductCategories.map(category => - category.subcategories && - {category.subcategories.map(sub => - )} - - ) - } - - - - this.props.onDataChanged({description}, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS)}/> - - } -
); - } + render() { + let { genericFieldInfo } = this.props; + return ( +
+ {genericFieldInfo && ( + + + + name.length <= 25 && + this.props.onDataChanged( + { name }, + forms.VENDOR_SOFTWARE_PRODUCT_DETAILS + ) + } + /> + {this.props.isVendorArchived ? ( + this.onVendorRemove()} + vendorName={this.props.vendorName} + /> + ) : ( + + this.onVendorParamChanged(e) + }> + {sortByStringProperty( + this.props.finalizedLicenseModelList, + 'name' + ).map(lm => ( + + ))} + + )} + this.onSelectSubCategory(e)}> + {this.props.softwareProductCategories.map( + category => + category.subcategories && ( + + {category.subcategories.map( + sub => ( + + ) + )} + + ) + )} + + + + + this.props.onDataChanged( + { description }, + forms.VENDOR_SOFTWARE_PRODUCT_DETAILS + ) + } + /> + + + )} +
+ ); + } } class LicensesSection extends React.Component { - static propTypes = { - onVendorParamChanged: PropTypes.func.isRequired, - vendorId: PropTypes.string, - licensingVersion: PropTypes.string, - licensingVersionsList: PropTypes.array, - licensingData: PropTypes.shape({ - licenceAgreement: PropTypes.string, - featureGroups: PropTypes.array - }), - onFeatureGroupsChanged: PropTypes.func.isRequired, - onLicensingDataChanged: PropTypes.func.isRequired, - featureGroupsList: PropTypes.array, - licenseAgreementList: PropTypes.array, - isVendorArchived: PropTypes.bool - }; + static propTypes = { + onVendorParamChanged: PropTypes.func.isRequired, + vendorId: PropTypes.string, + licensingVersion: PropTypes.string, + licensingVersionsList: PropTypes.array, + licensingData: PropTypes.shape({ + licenceAgreement: PropTypes.string, + featureGroups: PropTypes.array + }), + onFeatureGroupsChanged: PropTypes.func.isRequired, + onLicensingDataChanged: PropTypes.func.isRequired, + featureGroupsList: PropTypes.array, + licenseAgreementList: PropTypes.array, + isVendorArchived: PropTypes.bool + }; - onVendorParamChanged(e) { - const selectedIndex = e.target.selectedIndex; - const licensingVersion = e.target.options[selectedIndex].value; - this.props.onVendorParamChanged({vendorId: this.props.vendorId, licensingVersion}, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS); - } + onVendorParamChanged(e) { + const selectedIndex = e.target.selectedIndex; + const licensingVersion = e.target.options[selectedIndex].value; + this.props.onVendorParamChanged( + { vendorId: this.props.vendorId, licensingVersion }, + forms.VENDOR_SOFTWARE_PRODUCT_DETAILS + ); + } - onLicensingDataChanged(e) { - const selectedIndex = e.target.selectedIndex; - const licenseAgreement = e.target.options[selectedIndex].value; - this.props.onLicensingDataChanged({licenseAgreement, featureGroups: []}); - } + onLicensingDataChanged(e) { + const selectedIndex = e.target.selectedIndex; + const licenseAgreement = e.target.options[selectedIndex].value; + this.props.onLicensingDataChanged({ + licenseAgreement, + featureGroups: [] + }); + } - render(){ - return ( - - - this.onVendorParamChanged(e)} - value={this.props.licensingVersion || ''} - label={i18n('Licensing Version')} - disabled={this.props.isVendorArchived} - type='select'> - {this.props.licensingVersionsList.map(version => - - )} - - - - this.onLicensingDataChanged(e)}> - - {this.props.licenseAgreementList.map(la => )} - - - - {this.props.licensingData.licenseAgreement && ( - {}} - disabled={this.props.isVendorArchived} - onEnumChange={featureGroups => this.props.onFeatureGroupsChanged({featureGroups})} - multiSelectedEnum={this.props.licensingData.featureGroups} - name='feature-groups' - label={i18n('Feature Groups')} - clearable={false} - values={this.props.featureGroupsList}/>) - } - - - ); - } + render() { + return ( + + + this.onVendorParamChanged(e)} + value={this.props.licensingVersion || ''} + label={i18n('Licensing Version')} + disabled={this.props.isVendorArchived} + type="select"> + {this.props.licensingVersionsList.map(version => ( + + ))} + + + + this.onLicensingDataChanged(e)}> + + {this.props.licenseAgreementList.map(la => ( + + ))} + + + + {this.props.licensingData.licenseAgreement && ( + {}} + disabled={this.props.isVendorArchived} + onEnumChange={featureGroups => + this.props.onFeatureGroupsChanged({ + featureGroups + }) + } + multiSelectedEnum={ + this.props.licensingData.featureGroups + } + name="feature-groups" + label={i18n('Feature Groups')} + clearable={false} + values={this.props.featureGroupsList} + /> + )} + + + ); + } } -const AvailabilitySection = (props) => ( - - - props.onQDataChanged({'general/availability/useAvailabilityZonesForHighAvailability' : aZone})} /> - - +const AvailabilitySection = props => ( + + + + props.onQDataChanged({ + 'general/availability/useAvailabilityZonesForHighAvailability': aZone + }) + } + /> + + ); -const RegionsSection = (props) => ( - - - {}} - onEnumChange={(regions) => props.onQDataChanged({'general/regionsData/regions' : regions})} - multiSelectedEnum={props.dataMap['general/regionsData/regions']} - name='vsp-regions' - clearable={false} - values={props.genericFieldInfo['general/regionsData/regions'].enum} /> - - +const RegionsSection = props => ( + + + {}} + onEnumChange={regions => + props.onQDataChanged({ + 'general/regionsData/regions': regions + }) + } + multiSelectedEnum={props.dataMap['general/regionsData/regions']} + name="vsp-regions" + clearable={false} + values={ + props.genericFieldInfo['general/regionsData/regions'].enum + } + /> + + ); -const StorageDataReplicationSection = (props) => ( - - - props.onQDataChanged({'general/storageDataReplication/storageReplicationSize' : sRep})} /> - - - props.onQDataChanged({'general/storageDataReplication/storageReplicationSource' : sRepSource})} /> - - - props.onQDataChanged({'general/storageDataReplication/storageReplicationFrequency' : sRepFreq})} /> - - - props.onQDataChanged({'general/storageDataReplication/storageReplicationDestination' : sRepDest})} /> - - +const StorageDataReplicationSection = props => ( + + + + props.onQDataChanged({ + 'general/storageDataReplication/storageReplicationSize': sRep + }) + } + /> + + + + props.onQDataChanged({ + 'general/storageDataReplication/storageReplicationSource': sRepSource + }) + } + /> + + + + props.onQDataChanged({ + 'general/storageDataReplication/storageReplicationFrequency': sRepFreq + }) + } + /> + + + + props.onQDataChanged({ + 'general/storageDataReplication/storageReplicationDestination': sRepDest + }) + } + /> + + ); class SoftwareProductDetails extends Component { + static propTypes = { + vendorName: PropTypes.string, + currentSoftwareProduct: PropTypes.shape({ + id: PropTypes.string, + name: PropTypes.string, + description: PropTypes.string, + category: PropTypes.string, + subCategory: PropTypes.string, + vendorId: PropTypes.string, + vendorName: PropTypes.string, + licensingVersion: PropTypes.string, + licensingData: PropTypes.shape({ + licenceAgreement: PropTypes.string, + featureGroups: PropTypes.array + }) + }), + softwareProductCategories: PropTypes.array, + finalizedLicenseModelList: PropTypes.array, + licenseAgreementList: PropTypes.array, + featureGroupsList: PropTypes.array, + onSubmit: PropTypes.func.isRequired, + onDataChanged: PropTypes.func.isRequired, + onValidityChanged: PropTypes.func.isRequired, + qdata: PropTypes.object.isRequired, + onQDataChanged: PropTypes.func.isRequired, + onVendorParamChanged: PropTypes.func.isRequired + }; - static propTypes = { - vendorName: PropTypes.string, - currentSoftwareProduct: PropTypes.shape({ - id: PropTypes.string, - name: PropTypes.string, - description: PropTypes.string, - category: PropTypes.string, - subCategory: PropTypes.string, - vendorId: PropTypes.string, - vendorName: PropTypes.string, - licensingVersion: PropTypes.string, - licensingData: PropTypes.shape({ - licenceAgreement: PropTypes.string, - featureGroups: PropTypes.array - }) - }), - softwareProductCategories: PropTypes.array, - finalizedLicenseModelList: PropTypes.array, - licenseAgreementList: PropTypes.array, - featureGroupsList: PropTypes.array, - onSubmit: PropTypes.func.isRequired, - onDataChanged: PropTypes.func.isRequired, - onValidityChanged: PropTypes.func.isRequired, - qdata: PropTypes.object.isRequired, - onQDataChanged: PropTypes.func.isRequired, - onVendorParamChanged: PropTypes.func.isRequired - }; - - prepareDataForGeneralSection(){ - let {softwareProductCategories, finalizedLicenseModelList, onDataChanged, currentSoftwareProduct, genericFieldInfo, isVendorArchived, onArchivedVendorRemove} = this.props; - let {name, description, vendorId, subCategory, vendorName} = currentSoftwareProduct; - return { - name, - description, - vendorId, - subCategory, - softwareProductCategories, - finalizedLicenseModelList, - onDataChanged, - onVendorParamChanged: args => this.onVendorParamChanged(args), - onSelectSubCategory: args => this.onSelectSubCategory(args), - genericFieldInfo, - vendorName, - isVendorArchived, - onArchivedVendorRemove - }; - - } + prepareDataForGeneralSection() { + let { + softwareProductCategories, + finalizedLicenseModelList, + onDataChanged, + currentSoftwareProduct, + genericFieldInfo, + isVendorArchived, + onArchivedVendorRemove + } = this.props; + let { + name, + description, + vendorId, + subCategory, + vendorName + } = currentSoftwareProduct; + return { + name, + description, + vendorId, + subCategory, + softwareProductCategories, + finalizedLicenseModelList, + onDataChanged, + onVendorParamChanged: args => this.onVendorParamChanged(args), + onSelectSubCategory: args => this.onSelectSubCategory(args), + genericFieldInfo, + vendorName, + isVendorArchived, + onArchivedVendorRemove + }; + } - prepareDataForLicensesSection(){ - let { featureGroupsList, licenseAgreementList, currentSoftwareProduct, isVendorArchived} = this.props; - let {vendorId, licensingVersion, licensingData = {}} = currentSoftwareProduct; - return { - onVendorParamChanged: args => this.onVendorParamChanged(args), - vendorId, - licensingVersion, - licensingVersionsList: this.buildLicensingVersionsListItems(), - licensingData, - onFeatureGroupsChanged: args => this.onFeatureGroupsChanged(args), - onLicensingDataChanged: args => this.onLicensingDataChanged(args), - featureGroupsList, - licenseAgreementList, - isVendorArchived - }; + prepareDataForLicensesSection() { + let { + featureGroupsList, + licenseAgreementList, + currentSoftwareProduct, + isVendorArchived + } = this.props; + let { + vendorId, + licensingVersion, + licensingData = {} + } = currentSoftwareProduct; + return { + onVendorParamChanged: args => this.onVendorParamChanged(args), + vendorId, + licensingVersion, + licensingVersionsList: this.buildLicensingVersionsListItems(), + licensingData, + onFeatureGroupsChanged: args => this.onFeatureGroupsChanged(args), + onLicensingDataChanged: args => this.onLicensingDataChanged(args), + featureGroupsList, + licenseAgreementList, + isVendorArchived + }; + } - } + render() { + let { currentSoftwareProduct } = this.props; + let { qdata, onQDataChanged, dataMap, qGenericFieldInfo } = this.props; + let { isReadOnlyMode } = this.props; - render() { - let {currentSoftwareProduct} = this.props; - let {qdata, onQDataChanged, dataMap, qGenericFieldInfo} = this.props; - let {isReadOnlyMode} = this.props; + return ( +
+
+ (this.validationForm = validationForm) + } + className="vsp-general-tab" + hasButtons={false} + formReady={null} + isValid={this.props.isFormValid} + onSubmit={() => + this.props.onSubmit(currentSoftwareProduct, qdata) + } + onValidityChanged={isValidityData => + this.props.onValidityChanged(isValidityData) + } + isReadOnlyMode={isReadOnlyMode}> + + + + + + +
+ ); + } - return ( -
-
this.validationForm = validationForm} - className='vsp-general-tab' - hasButtons={false} - formReady={null} - isValid={this.props.isFormValid} - onSubmit={() => this.props.onSubmit(currentSoftwareProduct, qdata)} - onValidityChanged={(isValidityData) => this.props.onValidityChanged(isValidityData)} - isReadOnlyMode={isReadOnlyMode}> - - - - - - -
- ); - } + onVendorParamChanged({ vendorId, licensingVersion }) { + let { finalizedLicenseModelList, onVendorParamChanged } = this.props; + if (!licensingVersion) { + const licensingVersionsList = this.buildLicensingVersionsListItems(); + licensingVersion = licensingVersionsList[0].enum; + } - onVendorParamChanged({vendorId, licensingVersion}) { - - let {finalizedLicenseModelList, onVendorParamChanged} = this.props; - if(!licensingVersion) { - const licensingVersionsList = this.buildLicensingVersionsListItems(); - licensingVersion = licensingVersionsList[0].enum; - } - - if (!vendorId) { - vendorId = finalizedLicenseModelList[0].id; - } - - let vendorName = finalizedLicenseModelList.find(licenseModelItem => licenseModelItem.id === vendorId).name || ''; - let deltaData = { - vendorId, - vendorName, - licensingVersion, - licensingData: {} - }; + if (!vendorId) { + vendorId = finalizedLicenseModelList[0].id; + } - onVendorParamChanged(deltaData, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS); + let vendorName = + finalizedLicenseModelList.find( + licenseModelItem => licenseModelItem.id === vendorId + ).name || ''; + let deltaData = { + vendorId, + vendorName, + licensingVersion, + licensingData: {} + }; - } + onVendorParamChanged(deltaData, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS); + } - buildLicensingVersionsListItems() { - let {licensingVersionsList} = this.props; + buildLicensingVersionsListItems() { + let { licensingVersionsList } = this.props; - let licensingVersionsListItems = [{ - enum: '', - title: i18n('Select...') - }]; + let licensingVersionsListItems = [ + { + enum: '', + title: i18n('Select...') + } + ]; - return licensingVersionsListItems.concat(licensingVersionsList.map(version => ({enum: version.id, title: version.name}))); - } + return licensingVersionsListItems.concat( + licensingVersionsList.map(version => ({ + enum: version.id, + title: version.name + })) + ); + } - onFeatureGroupsChanged({featureGroups}) { - this.onLicensingDataChanged({featureGroups}); - } + onFeatureGroupsChanged({ featureGroups }) { + this.onLicensingDataChanged({ featureGroups }); + } - onLicensingDataChanged(deltaData) { - this.props.onDataChanged({ - licensingData: { - ...this.props.currentSoftwareProduct.licensingData, - ...deltaData - } - }, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS); - } + onLicensingDataChanged(deltaData) { + this.props.onDataChanged( + { + licensingData: { + ...this.props.currentSoftwareProduct.licensingData, + ...deltaData + } + }, + forms.VENDOR_SOFTWARE_PRODUCT_DETAILS + ); + } - onSelectSubCategory(subCategory) { - let {softwareProductCategories, onDataChanged} = this.props; - let category = SoftwareProductCategoriesHelper.getCurrentCategoryOfSubCategory(subCategory, softwareProductCategories); - onDataChanged({category, subCategory}, forms.VENDOR_SOFTWARE_PRODUCT_DETAILS); - } + onSelectSubCategory(subCategory) { + let { softwareProductCategories, onDataChanged } = this.props; + let category = SoftwareProductCategoriesHelper.getCurrentCategoryOfSubCategory( + subCategory, + softwareProductCategories + ); + onDataChanged( + { category, subCategory }, + forms.VENDOR_SOFTWARE_PRODUCT_DETAILS + ); + } - save(){ - return this.validationForm.handleFormSubmit(new Event('dummy')); - } + save() { + return this.validationForm.handleFormSubmit(new Event('dummy')); + } } export default SoftwareProductDetails; -- cgit 1.2.3-korg