Adding Prettier and fixing up eslint version

Issue-ID: SDC-1094
Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd
Signed-off-by: Einav Weiss Keidar <einavw@amdocs.com>

1 files changed, 232 insertions, 119 deletions

diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx
index 7c9ae438d9..e44d2bd966 100644
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx
@@ -11,127 +11,240 @@ import SelectActionTableCell from 'nfvo-components/table/SelectActionTableCell.j
 import Validator from 'nfvo-utils/Validator.js';
 
 export default class SoftwareProductDeploymentEditorView extends React.Component {
-	render() {
-		let {data, isEdit, onClose, onDataChanged, isReadOnlyMode, selectedFeatureGroupsList, componentsList, computesList, genericFieldInfo} = this.props;
-		let {model, description, featureGroupId, componentComputeAssociations = []} = data;
-		let featureGroupsExist = selectedFeatureGroupsList.length > 0;
-		return (
-			<div>
-				{genericFieldInfo && <Form
-					ref='validationForm'
-					hasButtons={true}
-					labledButtons={true}
-					isReadOnlyMode={isReadOnlyMode}
-					onSubmit={ () => this.submit() }
-					submitButtonText={isEdit ? i18n('Save') : i18n('Create')}
-					onReset={ () => onClose() }
-					onValidateForm={() => this.validate() }
-					isValid={this.props.isFormValid}
-					formReady={this.props.formReady}
-					className='vsp-deployment-editor'>
-					<GridSection hasLastColSet>
-						<GridItem colSpan={1}>
-							<Input
-								onChange={model => onDataChanged({model}, {model: model => this.validateName(model)})}
-								label={i18n('Model')}
-								value={model}
-								data-test-id='deployment-model'
-								isValid={genericFieldInfo.model.isValid}
-								errorText={genericFieldInfo.model.errorText}
-								isRequired={true}
-								type='text'/>
-						</GridItem>
-						<GridItem colSpan={3} lastColInRow>
-							<Input
-								onChange={description => onDataChanged({description})}
-								label={i18n('Description')}
-								value={description}
-								data-test-id='deployment-description'
-								isValid={genericFieldInfo.description.isValid}
-								errorText={genericFieldInfo.description.errorText}
-								type='text'/>
-						</GridItem>
-					</GridSection>
-					<GridSection className={`deployment-feature-groups-section${!featureGroupsExist ? ' no-feature-groups' : ''}`} title={i18n('License Details')} hasLastColSet>
-						<GridItem colSpan={1}>
-							<SelectInput
-								data-test-id='deployment-feature-groups'
-								label={i18n('Feature Group')}
-								value={featureGroupId}
-								onChange={featureGroup => onDataChanged({featureGroupId: featureGroup ? featureGroup.value : null})}
-								type='select'
-								clearable={true}
-								disabled={isReadOnlyMode || !featureGroupsExist}
-								className='field-section'
-								options={selectedFeatureGroupsList}/>
-						</GridItem>
-					</GridSection>
-					{!featureGroupsExist && <GridSection className='deployment-feature-group-warning-section'>
-						<GridItem colSpan={3}>
-							<span>{i18n('Please assign Feature Groups in VSP General')}</span>
-						</GridItem>
-					</GridSection>}
-					<GridSection title={i18n('Assign VFCs and Compute Flavors')} className='vfc-table' hasLastColSet>
-						<GridItem colSpan={4} lastColInRow>
-							<SelectActionTable
-								columns={['Virtual Function Components', 'Compute Flavors']}
-								numOfIcons={0}>
-								{componentComputeAssociations.map( (association, index) =>
-									<SelectActionTableRow key={association.componentId}>
-										<SelectActionTableCell
-											options={
-												componentsList
-												.map(component => ({value: component.id, label: component.displayName}) )
-											}
-											selected={association.componentId}
-											onChange={componentId => {
-												let newAssociations = [...componentComputeAssociations];
-												newAssociations[index] = {...newAssociations[index], componentId};
-												onDataChanged({componentComputeAssociations: newAssociations});
-											}}
-											disabled={true}/>
-										<SelectActionTableCell
-											options={
-												computesList
-												.filter(compute => compute.componentId === association.componentId)
-												.map(compute => ({value: compute.computeFlavorId, label: compute.name}) )
-											}
-											selected={association.computeFlavorId}
-											onChange={computeFlavorId => {
-												let newAssociations = [...componentComputeAssociations];
-												newAssociations[index] = {...newAssociations[index], computeFlavorId};
-												onDataChanged({componentComputeAssociations: newAssociations});
-											}}
-											disabled={isReadOnlyMode}/>
-									</SelectActionTableRow>
-								)}
-							</SelectActionTable>
-						</GridItem>
-					</GridSection>
-				</Form>}
-			</div>
-		);
-	}
+    render() {
+        let {
+            data,
+            isEdit,
+            onClose,
+            onDataChanged,
+            isReadOnlyMode,
+            selectedFeatureGroupsList,
+            componentsList,
+            computesList,
+            genericFieldInfo
+        } = this.props;
+        let {
+            model,
+            description,
+            featureGroupId,
+            componentComputeAssociations = []
+        } = data;
+        let featureGroupsExist = selectedFeatureGroupsList.length > 0;
+        return (
+            <div>
+                {genericFieldInfo && (
+                    <Form
+                        ref="validationForm"
+                        hasButtons={true}
+                        labledButtons={true}
+                        isReadOnlyMode={isReadOnlyMode}
+                        onSubmit={() => this.submit()}
+                        submitButtonText={
+                            isEdit ? i18n('Save') : i18n('Create')
+                        }
+                        onReset={() => onClose()}
+                        onValidateForm={() => this.validate()}
+                        isValid={this.props.isFormValid}
+                        formReady={this.props.formReady}
+                        className="vsp-deployment-editor">
+                        <GridSection hasLastColSet>
+                            <GridItem colSpan={1}>
+                                <Input
+                                    onChange={model =>
+                                        onDataChanged(
+                                            { model },
+                                            {
+                                                model: model =>
+                                                    this.validateName(model)
+                                            }
+                                        )
+                                    }
+                                    label={i18n('Model')}
+                                    value={model}
+                                    data-test-id="deployment-model"
+                                    isValid={genericFieldInfo.model.isValid}
+                                    errorText={genericFieldInfo.model.errorText}
+                                    isRequired={true}
+                                    type="text"
+                                />
+                            </GridItem>
+                            <GridItem colSpan={3} lastColInRow>
+                                <Input
+                                    onChange={description =>
+                                        onDataChanged({ description })
+                                    }
+                                    label={i18n('Description')}
+                                    value={description}
+                                    data-test-id="deployment-description"
+                                    isValid={
+                                        genericFieldInfo.description.isValid
+                                    }
+                                    errorText={
+                                        genericFieldInfo.description.errorText
+                                    }
+                                    type="text"
+                                />
+                            </GridItem>
+                        </GridSection>
+                        <GridSection
+                            className={`deployment-feature-groups-section${
+                                !featureGroupsExist ? ' no-feature-groups' : ''
+                            }`}
+                            title={i18n('License Details')}
+                            hasLastColSet>
+                            <GridItem colSpan={1}>
+                                <SelectInput
+                                    data-test-id="deployment-feature-groups"
+                                    label={i18n('Feature Group')}
+                                    value={featureGroupId}
+                                    onChange={featureGroup =>
+                                        onDataChanged({
+                                            featureGroupId: featureGroup
+                                                ? featureGroup.value
+                                                : null
+                                        })
+                                    }
+                                    type="select"
+                                    clearable={true}
+                                    disabled={
+                                        isReadOnlyMode || !featureGroupsExist
+                                    }
+                                    className="field-section"
+                                    options={selectedFeatureGroupsList}
+                                />
+                            </GridItem>
+                        </GridSection>
+                        {!featureGroupsExist && (
+                            <GridSection className="deployment-feature-group-warning-section">
+                                <GridItem colSpan={3}>
+                                    <span>
+                                        {i18n(
+                                            'Please assign Feature Groups in VSP General'
+                                        )}
+                                    </span>
+                                </GridItem>
+                            </GridSection>
+                        )}
+                        <GridSection
+                            title={i18n('Assign VFCs and Compute Flavors')}
+                            className="vfc-table"
+                            hasLastColSet>
+                            <GridItem colSpan={4} lastColInRow>
+                                <SelectActionTable
+                                    columns={[
+                                        'Virtual Function Components',
+                                        'Compute Flavors'
+                                    ]}
+                                    numOfIcons={0}>
+                                    {componentComputeAssociations.map(
+                                        (association, index) => (
+                                            <SelectActionTableRow
+                                                key={association.componentId}>
+                                                <SelectActionTableCell
+                                                    options={componentsList.map(
+                                                        component => ({
+                                                            value: component.id,
+                                                            label:
+                                                                component.displayName
+                                                        })
+                                                    )}
+                                                    selected={
+                                                        association.componentId
+                                                    }
+                                                    onChange={componentId => {
+                                                        let newAssociations = [
+                                                            ...componentComputeAssociations
+                                                        ];
+                                                        newAssociations[
+                                                            index
+                                                        ] = {
+                                                            ...newAssociations[
+                                                                index
+                                                            ],
+                                                            componentId
+                                                        };
+                                                        onDataChanged({
+                                                            componentComputeAssociations: newAssociations
+                                                        });
+                                                    }}
+                                                    disabled={true}
+                                                />
+                                                <SelectActionTableCell
+                                                    options={computesList
+                                                        .filter(
+                                                            compute =>
+                                                                compute.componentId ===
+                                                                association.componentId
+                                                        )
+                                                        .map(compute => ({
+                                                            value:
+                                                                compute.computeFlavorId,
+                                                            label: compute.name
+                                                        }))}
+                                                    selected={
+                                                        association.computeFlavorId
+                                                    }
+                                                    onChange={computeFlavorId => {
+                                                        let newAssociations = [
+                                                            ...componentComputeAssociations
+                                                        ];
+                                                        newAssociations[
+                                                            index
+                                                        ] = {
+                                                            ...newAssociations[
+                                                                index
+                                                            ],
+                                                            computeFlavorId
+                                                        };
+                                                        onDataChanged({
+                                                            componentComputeAssociations: newAssociations
+                                                        });
+                                                    }}
+                                                    disabled={isReadOnlyMode}
+                                                />
+                                            </SelectActionTableRow>
+                                        )
+                                    )}
+                                </SelectActionTable>
+                            </GridItem>
+                        </GridSection>
+                    </Form>
+                )}
+            </div>
+        );
+    }
 
-	validateName(value) {
-		const {data: {id = ''}, DFNames} = this.props;
-		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: DFNames});
+    validateName(value) {
+        const { data: { id = '' }, DFNames } = this.props;
+        const isExists = Validator.isItemNameAlreadyExistsInList({
+            itemId: id,
+            itemName: value,
+            list: DFNames
+        });
 
-		return !isExists ?  {isValid: true, errorText: ''} :
-			{isValid: false, errorText: i18n('Deployment flavor by the name \'' + value + '\' already exists. Deployment flavor name must be unique')};
-	}
+        return !isExists
+            ? { isValid: true, errorText: '' }
+            : {
+                  isValid: false,
+                  errorText: i18n(
+                      "Deployment flavor by the name '" +
+                          value +
+                          "' already exists. Deployment flavor name must be unique"
+                  )
+              };
+    }
 
-	submit(){
-		let {isEdit, onCreate, onEdit, onClose, data} = this.props;
-		if (isEdit) {
-			onEdit(data);
-		} else {
-			onCreate(data);
-		}
-		onClose();
-	}
+    submit() {
+        let { isEdit, onCreate, onEdit, onClose, data } = this.props;
+        if (isEdit) {
+            onEdit(data);
+        } else {
+            onCreate(data);
+        }
+        onClose();
+    }
 
-	validate() {
-		this.props.onValidateForm();
-	}
+    validate() {
+        this.props.onValidateForm();
+    }
 }