Adding filter bar

Issue-ID: AAI-543
Change-Id: I18ec69f4585a9f01feafd009fcd30493a039b064
Signed-off-by: Shawn Severin <shawn.severin@amdocs.com>

4 files changed, 296 insertions, 0 deletions

diff --git a/src/editAttributes/changeAttributeForm/ChangeAttributeForm.jsx b/src/editAttributes/changeAttributeForm/ChangeAttributeForm.jsx
new file mode 100644
index 0000000..34ba98d
--- /dev/null
+++ b/src/editAttributes/changeAttributeForm/ChangeAttributeForm.jsx
@@ -0,0 +1,161 @@
+/*
+ * ============LICENSE_START===================================================
+ * SPARKY (AAI UI service)
+ * ============================================================================
+ * Copyright © 2017 AT&T Intellectual Property.
+ * Copyright © 2017 Amdocs
+ * All rights reserved.
+ * ============================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=====================================================
+ *
+ * ECOMP and OpenECOMP are trademarks
+ * and service marks of AT&T Intellectual Property.
+ */
+
+import React, {Component} from 'react';
+import {Field, Fields, reduxForm, propTypes} from 'redux-form';
+import i18n from 'utils/i18n/i18n';
+
+import {
+  LABEL_NODE_URI,
+  LABEL_PROV_STATUS,
+  LABEL_ATTRIBUTES,
+  LABEL_IN_MAINT,
+  LABEL_IS_CLOSED_LOOP,
+  BUTTON_SUBMIT,
+  BUTTON_CLEAR,
+  NO_VALUE_SELECTED,
+  PREPROV,
+  NVTPROV,
+  DECOM,
+  PROV,
+  CAPPED,
+  RETIRED,
+  TRUE,
+  FALSE
+} from './ChangeAttributeFormConstants.js';
+import validate from './validate.js';
+
+class ChangeAttributeForm extends Component {
+
+  static propTypes = {
+    ...propTypes
+  };
+
+  renderTextField = ({input, label, type, meta: {touched, error}}) => (
+    <div className='attribute-field'>
+      <label>{label}</label>
+      <div>
+        <input {...input} placeholder={label} type={type}
+                          onBlur={() => input.value === '' ? input.onBlur(' ') : input.onBlur()}/>
+        {touched && ((error && <span className='error-message'>{error}</span>))}
+      </div>
+    </div>
+  );
+
+
+  booleanOptions = [
+    <option value={NO_VALUE_SELECTED}>{i18n(NO_VALUE_SELECTED)}</option>,
+    <option value='true'>{i18n(TRUE)}</option>,
+    <option value='false'>{i18n(FALSE)}</option>
+  ];
+
+  provStatusOptions = [
+    <option value={NO_VALUE_SELECTED}>{i18n(NO_VALUE_SELECTED)}</option>,
+    <option value={PREPROV}>{PREPROV}</option>,
+    <option value={NVTPROV}>{NVTPROV}</option>,
+    <option value={PROV}>{PROV}</option>,
+    <option value={CAPPED}>{CAPPED}</option>,
+    <option value={DECOM}>{DECOM}</option>,
+    <option value={RETIRED}>{RETIRED}</option>
+  ];
+
+  renderAttributeFields = (fields) => (
+    <div>
+      <div className='centre'>
+        {(fields.provStatus.meta.touched ||
+        fields.inMaint.meta.touched ||
+        fields.isClosedLoopDisabled.meta.touched) &&
+        fields.provStatus.meta.error &&
+        <span className='error-message'>{fields.provStatus.meta.error}</span>}
+      </div>
+      <div className='attribute-field'>
+        <label>{LABEL_PROV_STATUS}</label>
+        <div>
+          <select {...fields.provStatus.input}>
+            {this.provStatusOptions}
+          </select>
+        </div>
+      </div>
+      <div className='attribute-field'>
+        <label>{LABEL_IN_MAINT}</label>
+        <div>
+          <select {...fields.inMaint.input}>
+            {this.booleanOptions}
+          </select>
+        </div>
+      </div>
+      <div className='attribute-field'>
+        <label>{LABEL_IS_CLOSED_LOOP}</label>
+        <div>
+          <select {...fields.isClosedLoopDisabled.input}>
+            {this.booleanOptions}
+          </select>
+        </div>
+      </div>
+    </div>
+  );
+
+  render() {
+    const {
+		          handleSubmit,
+		          buttonSelected,
+		          pristine,
+		          reset,
+		          submitting} = this.props;
+
+    return (
+      <form onSubmit={handleSubmit}>
+        <Field name='uri' type='text' component={this.renderTextField}
+               label={i18n(LABEL_NODE_URI)}/>
+        <div className='centre'><h2>{i18n(LABEL_ATTRIBUTES)}</h2></div>
+        <Fields names={['provStatus', 'inMaint', 'isClosedLoopDisabled']}
+                component={this.renderAttributeFields}/>
+        <div className='centre'>
+          <button type='submit'
+                  disabled={pristine || submitting}
+                  onClick={() => {
+								            buttonSelected();
+								          }}>
+		          {i18n(BUTTON_SUBMIT)}
+          </button>
+          <button type='button'
+                  disabled={pristine || submitting}
+                  onClick={() => {
+								            reset();
+								            buttonSelected();
+								          }}>
+		          {i18n(BUTTON_CLEAR)}
+          </button>
+        </div>
+      </form>
+    );
+  }
+}
+
+export default reduxForm({
+  form: 'changeAttributeForm',
+  validate
+})(ChangeAttributeForm);
+
diff --git a/src/editAttributes/changeAttributeForm/ChangeAttributeFormConstants.js b/src/editAttributes/changeAttributeForm/ChangeAttributeFormConstants.js
new file mode 100644
index 0000000..02e8996
--- /dev/null
+++ b/src/editAttributes/changeAttributeForm/ChangeAttributeFormConstants.js
@@ -0,0 +1,46 @@
+/*
+ * ============LICENSE_START===================================================
+ * SPARKY (AAI UI service)
+ * ============================================================================
+ * Copyright © 2017 AT&T Intellectual Property.
+ * Copyright © 2017 Amdocs
+ * All rights reserved.
+ * ============================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=====================================================
+ *
+ * ECOMP and OpenECOMP are trademarks
+ * and service marks of AT&T Intellectual Property.
+ */
+
+export const LABEL_NODE_URI = 'Target Entity URI';
+export const LABEL_PROV_STATUS = 'prov-status';
+export const LABEL_IN_MAINT = 'in-maint';
+export const LABEL_IS_CLOSED_LOOP = 'is-closed-loop-disabled';
+export const LABEL_ATTRIBUTES = 'ATTRIBUTES';
+
+export const BUTTON_SUBMIT = 'Submit';
+export const BUTTON_CLEAR = 'Clear';
+
+export const NO_VALUE_SELECTED = 'No Value Selected';
+export const PREPROV = 'PREPROV';
+export const NVTPROV = 'NVTPROV';
+export const PROV = 'PROV';
+export const CAPPED = 'CAPPED';
+export const DECOM = 'DECOM';
+export const RETIRED = 'RETIRED';
+export const TRUE = 'TRUE';
+export const FALSE = 'FALSE';
+
+export const ERROR_MISSING_ATTR = 'At least one attribute must be set';
+export const ERROR_REQUIRED = 'Required';
diff --git a/src/editAttributes/changeAttributeForm/ChangeAttributeFormReducer.js b/src/editAttributes/changeAttributeForm/ChangeAttributeFormReducer.js
new file mode 100644
index 0000000..0778a0e
--- /dev/null
+++ b/src/editAttributes/changeAttributeForm/ChangeAttributeFormReducer.js
@@ -0,0 +1,38 @@
+/*
+ * ============LICENSE_START===================================================
+ * SPARKY (AAI UI service)
+ * ============================================================================
+ * Copyright © 2017 AT&T Intellectual Property.
+ * Copyright © 2017 Amdocs
+ * All rights reserved.
+ * ============================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=====================================================
+ *
+ * ECOMP and OpenECOMP are trademarks
+ * and service marks of AT&T Intellectual Property.
+ */
+
+/*import { combineReducers } from 'redux'
+ import { reducer as formReducer } from 'redux-form'
+ 
+ 
+ 
+ const reducer = combineReducers({
+ form: formReducer.validation({
+ changeAttributeForm: validate
+ })
+ });
+ 
+ export default reducer;
+ */
diff --git a/src/editAttributes/changeAttributeForm/validate.js b/src/editAttributes/changeAttributeForm/validate.js
new file mode 100644
index 0000000..d6a8d99
--- /dev/null
+++ b/src/editAttributes/changeAttributeForm/validate.js
@@ -0,0 +1,51 @@
+/*
+ * ============LICENSE_START===================================================
+ * SPARKY (AAI UI service)
+ * ============================================================================
+ * Copyright © 2017 AT&T Intellectual Property.
+ * Copyright © 2017 Amdocs
+ * All rights reserved.
+ * ============================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END=====================================================
+ *
+ * ECOMP and OpenECOMP are trademarks
+ * and service marks of AT&T Intellectual Property.
+ */
+
+import i18n from 'utils/i18n/i18n';
+
+import {
+  ERROR_MISSING_ATTR,
+  ERROR_REQUIRED,
+  NO_VALUE_SELECTED
+} from './ChangeAttributeFormConstants.js';
+
+const validate = (values) => {
+  const errors = {};
+  
+  if (!values.uri || values.uri.replace(/\s/g, '') === '') {
+    errors.uri = i18n(ERROR_REQUIRED);
+  }
+  if ((!values.provStatus || values.provStatus === NO_VALUE_SELECTED) &&
+    (!values.inMaint || values.inMaint === NO_VALUE_SELECTED) &&
+    (!values.isClosedLoopDisabled ||
+    values.isClosedLoopDisabled ===
+    NO_VALUE_SELECTED)) {
+    errors.provStatus = i18n(ERROR_MISSING_ATTR);
+  }
+  
+  return errors;
+};
+
+export default validate;