Updated Sparky to add ECOMP functionality Browse, Specialized Search, BYOQ, and the...
[aai/sparky-fe.git] / src / app / model / testGallery.jsx
diff --git a/src/app/model/testGallery.jsx b/src/app/model/testGallery.jsx
new file mode 100644 (file)
index 0000000..8d73388
--- /dev/null
@@ -0,0 +1,91 @@
+/*
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2021 AT&T Intellectual Property. 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=========================================================
+ */
+
+import React, {Component} from 'react';
+import ModelGallery from 'app/modelSearch/components/ModelGallery.jsx';
+import testData from 'app/CustomQueryMultiNode';
+
+class testGallery extends Component {
+
+  state = {
+    nodes: [],
+    multipleNodes: '',
+    isLoading: 'show'
+  }
+
+  componentWillMount () {
+    this.processData(testData);
+  }
+
+
+
+  processData = (data) => {
+    console.log('Response data' + JSON.stringify(data));
+    if (data && data.results) {
+      //this.nodes = data.results;
+      this.setState({
+        nodes: data.results
+      });
+
+      this.multipleNodes = this.state.nodes.length > 1;
+    }
+    if (data && data.headers && data.headers.get('total-results')) {
+      this.modelService.setTotalResults(data.headers.get('total-results'));
+    }
+    this.setState({
+      isLoading: 'hidden'
+    });
+  }
+
+  render() {
+
+    let nodes = '';
+    if ( this.state.nodes.length > 0 ) {
+
+      console.log('nodes exist');
+
+      nodes =
+        (<div className='model-container'>
+          <ModelGallery
+            nodes={this.state.nodes}/>
+        </div>);
+    }
+
+    return(
+      <div className='multipleNodes'>
+        <div className={!this.state.isLoading}>
+          <div className='col align-self-cemter'>
+            <fa name='cog' className='fa-5x fa-spin'></fa>
+          </div>
+        </div>
+        <div className={!this.state.isLoading}>
+          <h2>{this.header}</h2>
+          <div className='nodes container-fluid'>
+            <div className='row-dsl'>
+              {nodes}
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default testGallery;