Frontend initial draft

New frontend initial draft in React with docker image in nginx

Issue-ID: CLAMP-413
Change-Id: Ie5826d79aa3db23f863e8fd217189ba41534abe9
Signed-off-by: sebdet <sebastien.determe@intl.att.com>

18 files changed, 379 insertions, 70 deletions

diff --git a/.gitignore b/.gitignore
index f70506ad0..ed38c1320 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,6 +5,8 @@ target
 .buildpath
 .idea
 *.iml
+ui-react/node_modules
+ui-react/build
 **/logs/
 **/.evosuite/
 **/debug-logs/
diff --git a/pom.xml b/pom.xml
index ec1033b05..79cf2a982 100644
--- a/pom.xml
+++ b/pom.xml
@@ -1025,8 +1025,8 @@
 														</run>
 												</image>
 												<image>
-														<name>onap/clamp</name>
-														<alias>onap-clamp</alias>
+														<name>onap/clamp-backend</name>
+														<alias>onap-clamp-backend</alias>
 														<run>
 															<skip>true</skip>
 														</run>
@@ -1039,10 +1039,32 @@
 																</tags>
 																<!-- A relative path is looked up in ${project.basedir}/src/main/docker
 																		by default -->
-																<dockerFile>Dockerfile</dockerFile>
+																<dockerFile>backend/Dockerfile</dockerFile>
 																<assembly>
-																		<descriptor>assembly/clamp-files.xml</descriptor>
-																		<name>onap-clamp</name>
+																		<descriptor>backend/backend-files.xml</descriptor>
+																		<name>onap-clamp-backend</name>
+																</assembly>
+														</build>
+												</image>
+												<image>
+														<name>onap/clamp-frontend</name>
+														<alias>onap-clamp-frontend</alias>
+														<run>
+															<skip>true</skip>
+														</run>
+														<build>
+																<cleanup>true</cleanup>
+																<tags>
+																		<tag>latest</tag>
+																		<tag>${project.docker.latesttagtimestamp.version}</tag>
+																		<tag>${project.docker.latesttag.version}</tag>
+																</tags>
+																<!-- A relative path is looked up in ${project.basedir}/src/main/docker
+																		by default -->
+																<dockerFile>frontend/Dockerfile</dockerFile>
+																<assembly>
+																		<descriptor>frontend/frontend-files.xml</descriptor>
+																		<name>onap-clamp-frontend</name>
 																</assembly>
 														</build>
 												</image>
@@ -1059,7 +1081,7 @@
 																		<tag>${project.docker.latesttagtimestamp.version}</tag>
 																		<tag>${project.docker.latesttag.version}</tag>
 																</tags>
-																<dockerFile>logstash/Dockerfile.logstash</dockerFile>
+																<dockerFile>logstash/Dockerfile</dockerFile>
 														</build>
 												</image>
 												<image>
@@ -1075,7 +1097,7 @@
 																		<tag>${project.docker.latesttagtimestamp.version}</tag>
 																		<tag>${project.docker.latesttag.version}</tag>
 																</tags>
-																<dockerFile>kibana/Dockerfile.kibana</dockerFile>
+																<dockerFile>kibana/Dockerfile</dockerFile>
 														</build>
 												</image>
 										</images>
diff --git a/src/main/docker/Dockerfile b/src/main/docker/Dockerfile
deleted file mode 100644
index c47d6229e..000000000
--- a/src/main/docker/Dockerfile
+++ /dev/null
@@ -1,34 +0,0 @@
-FROM openjdk:8u191-jdk-alpine3.9

-

-MAINTAINER "The Onap Team"

-LABEL Description="This immage contains alpine, openjdk 11 and clamp"

-

-ARG http_proxy

-ARG https_proxy

-ENV HTTP_PROXY=$http_proxy

-ENV HTTPS_PROXY=$https_proxy

-ENV http_proxy=$HTTP_PROXY

-ENV https_proxy=$HTTPS_PROXY

-

-RUN addgroup onap && adduser -D -G onap clamp

-VOLUME /opt/clamp/config

-RUN mkdir /var/log/onap

-RUN chmod a+rwx /var/log/onap

-

-COPY onap-clamp/clamp.jar /opt/clamp/app.jar

-RUN chmod 700 /opt/clamp/app.jar

-

-RUN chown -R clamp:onap /opt/clamp

-

-RUN apk add fontconfig

-RUN apk add ttf-dejavu

-

-RUN ln -s /usr/lib/libfontconfig.so.1 /usr/lib/libfontconfig.so && \

-  ln -s /lib/libuuid.so.1 /usr/lib/libuuid.so.1 && \

-  ln -s /lib/libc.musl-x86_64.so.1 /usr/lib/libc.musl-x86_64.so.1

-

-ENV LD_LIBRARY_PATH /usr/lib

-

-USER clamp

-WORKDIR /opt/clamp/

-ENTRYPOINT ["java","-Djava.security.egd=file:/dev/./urandom","-Xms256m", "-Xmx1g", "-jar" ,"./app.jar"]

diff --git a/src/main/docker/backend/Dockerfile b/src/main/docker/backend/Dockerfile
new file mode 100644
index 000000000..9e5c8d8b1
--- /dev/null
+++ b/src/main/docker/backend/Dockerfile
@@ -0,0 +1,57 @@
+###

+# ============LICENSE_START=======================================================

+# ONAP CLAMP

+# ================================================================================

+# Copyright (C) 2018 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============================================

+# ===================================================================

+#

+###

+

+FROM openjdk:8u191-jdk-alpine3.9

+

+MAINTAINER "The Onap Team"

+LABEL Description="This immage contains alpine, openjdk 11 and clamp"

+

+ARG http_proxy

+ARG https_proxy

+ENV HTTP_PROXY=$http_proxy

+ENV HTTPS_PROXY=$https_proxy

+ENV http_proxy=$HTTP_PROXY

+ENV https_proxy=$HTTPS_PROXY

+

+RUN addgroup onap && adduser -D -G onap clamp

+VOLUME /opt/clamp/config

+RUN mkdir /var/log/onap

+RUN chmod a+rwx /var/log/onap

+

+COPY onap-clamp-backend/clamp.jar /opt/clamp/app.jar

+RUN chmod 700 /opt/clamp/app.jar

+

+RUN chown -R clamp:onap /opt/clamp

+

+RUN apk add fontconfig

+RUN apk add ttf-dejavu

+

+RUN ln -s /usr/lib/libfontconfig.so.1 /usr/lib/libfontconfig.so && \

+  ln -s /lib/libuuid.so.1 /usr/lib/libuuid.so.1 && \

+  ln -s /lib/libc.musl-x86_64.so.1 /usr/lib/libc.musl-x86_64.so.1

+

+ENV LD_LIBRARY_PATH /usr/lib

+

+USER clamp

+WORKDIR /opt/clamp/

+ENTRYPOINT ["java","-Djava.security.egd=file:/dev/./urandom","-Xms256m", "-Xmx1g", "-jar" ,"./app.jar"]

diff --git a/src/main/docker/assembly/clamp-files.xml b/src/main/docker/backend/backend-files.xml
index e4e9875c5..7a9c6f530 100644
--- a/src/main/docker/assembly/clamp-files.xml
+++ b/src/main/docker/backend/backend-files.xml
@@ -1,6 +1,6 @@
 <!--
   ============LICENSE_START=======================================================
-  ECOMP MSO
+  ECOMP CLAMP
   ================================================================================
   Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
   ================================================================================
@@ -29,7 +29,6 @@
 	</formats>
 	<includeBaseDirectory>false</includeBaseDirectory>
 
-
 	<fileSets>
 		<!-- include config files -->
 		<fileSet>
@@ -39,20 +38,6 @@
 			<directory>${project.build.directory}</directory>
 			<outputDirectory>/</outputDirectory>
 		</fileSet>
-		<fileSet>
-			<includes>
-				<include>>etc/config/**</include>
-			</includes>
-			<directory>${project.build.directory}</directory>
-			<outputDirectory>/</outputDirectory>
-		</fileSet>
-		<fileSet>
-			<includes>
-				<include>etc/keystore/**</include>
-			</includes>
-			<directory>${project.build.directory}</directory>
-			<outputDirectory>/</outputDirectory>
-		</fileSet>
 	</fileSets>
 
 </assembly>
diff --git a/src/main/docker/frontend/Dockerfile b/src/main/docker/frontend/Dockerfile
new file mode 100644
index 000000000..8c755b039
--- /dev/null
+++ b/src/main/docker/frontend/Dockerfile
@@ -0,0 +1,52 @@
+###

+# ============LICENSE_START=======================================================

+# ONAP CLAMP

+# ================================================================================

+# Copyright (C) 2019 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============================================

+# ===================================================================

+#

+###

+

+# build environment

+FROM node:12.4-alpine as build

+WORKDIR /app

+#ENV PATH /app/node_modules/.bin:$PATH

+COPY onap-clamp-frontend/ /app/

+RUN npm install --silent

+RUN npm run build

+

+FROM nginx:1.17.0-alpine

+

+MAINTAINER "The Onap Team"

+LABEL Description="This image contains Clamp frontend"

+

+ARG http_proxy

+ARG https_proxy

+ENV HTTP_PROXY=$http_proxy

+ENV HTTPS_PROXY=$https_proxy

+ENV http_proxy=$HTTP_PROXY

+ENV https_proxy=$HTTPS_PROXY

+

+RUN addgroup onap && adduser -D -G onap clamp

+RUN mkdir /var/log/onap

+RUN chmod a+rwx /var/log/onap

+

+COPY --from=build /app/build /usr/share/nginx/html

+RUN rm /etc/nginx/conf.d/default.conf

+COPY onap-clamp-frontend/nginx/nginx.conf /etc/nginx/conf.d

+EXPOSE 80

+CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file
diff --git a/src/main/docker/frontend/frontend-files.xml b/src/main/docker/frontend/frontend-files.xml
new file mode 100644
index 000000000..2610e828e
--- /dev/null
+++ b/src/main/docker/frontend/frontend-files.xml
@@ -0,0 +1,43 @@
+<!--
+  ============LICENSE_START=======================================================
+  ECOMP CLAMP
+  ================================================================================
+  Copyright (C) 2019 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=========================================================
+  -->
+
+<assembly
+	xmlns="http://maven.apache.org/plugins/maven-assembly-plugin/assembly/1.1.1"
+	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+	xsi:schemaLocation="http://maven.apache.org/plugins/maven-assembly-plugin/assembly/1.1.1 http://maven.apache.org/xsd/assembly-1.1.1.xsd">
+	<id>clamp-files</id>
+
+	<formats>
+		<format>tar.gz</format>
+	</formats>
+	<includeBaseDirectory>false</includeBaseDirectory>
+
+	<fileSets>
+		<!-- include config files -->
+		<fileSet>
+			<excludes>
+				<exclude>node_modules</exclude>
+			</excludes>
+			<directory>${project.basedir}/ui-react</directory>
+			<outputDirectory>/</outputDirectory>
+		</fileSet>
+	</fileSets>
+
+</assembly>
diff --git a/src/main/docker/kibana/Dockerfile.kibana b/src/main/docker/kibana/Dockerfile
index 9962fe31a..9962fe31a 100644
--- a/src/main/docker/kibana/Dockerfile.kibana
+++ b/src/main/docker/kibana/Dockerfile
diff --git a/src/main/docker/logstash/Dockerfile.logstash b/src/main/docker/logstash/Dockerfile
index f3075099c..73988dc79 100644
--- a/src/main/docker/logstash/Dockerfile.logstash
+++ b/src/main/docker/logstash/Dockerfile
@@ -1,17 +1,25 @@
-# Copyright (c) 2018 AT&T Intellectual Property.  All rights reserved.
-#
+###
+# ============LICENSE_START=======================================================
+# ONAP CLAMP
+# ================================================================================
+# Copyright (C) 2018 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
+# 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============================================
+# ===================================================================
+#
+###
 FROM  docker.elastic.co/logstash/logstash-oss:6.6.2
 
 MAINTAINER "The Onap Team"
diff --git a/src/main/resources/boot-message.txt b/src/main/resources/boot-message.txt
index 92e4ab029..46b0a6faa 100644
--- a/src/main/resources/boot-message.txt
+++ b/src/main/resources/boot-message.txt
@@ -1,14 +1,15 @@
      
          
- _____  _  _    __    ____    ____  __  __  ____  __    ____  _  _ 
-(  _  )( \( )  /__\  (  _ \  (  _ \(  )(  )(  _ \(  )  (_  _)( \( )
- )(_)(  )  (  /(__)\  )___/   )(_) ))(__)(  ) _ < )(__  _)(_  )  ( 
-(_____)(_)\_)(__)(__)(__)    (____/(______)(____/(____)(____)(_)\_)
-                 ___  __      __    __  __  ____                                  
-                / __)(  )    /__\  (  \/  )(  _ \                                 
-               ( (__  )(__  /(__)\  )    (  )___/                                 
-                \___)(____)(__)(__)(_/\/\_)(__)                                   
-
+       ▐ ▄  ▄▄▄·  ▄▄▄·    ▄▄▄ .▄▄▌       ▄▄▄· ▄▄▌ ▄▄▄▄▄      
+▪     •█▌▐█▐█ ▀█ ▐█ ▄█    ▀▄.▀·██•      ▐█ ▀█ ██• •██  ▪     
+ ▄█▀▄ ▐█▐▐▌▄█▀▀█  ██▀·    ▐▀▀▪▄██▪      ▄█▀▀█ ██▪  ▐█.▪ ▄█▀▄ 
+▐█▌.▐▌██▐█▌▐█ ▪▐▌▐█▪·•    ▐█▄▄▌▐█▌▐▌    ▐█ ▪▐▌▐█▌▐▌▐█▌·▐█▌.▐▌
+ ▀█▄▀▪▀▀ █▪ ▀  ▀ .▀        ▀▀▀ .▀▀▀      ▀  ▀ .▀▀▀ ▀▀▀  ▀█▄▀▪
+                ▄▄· ▄▄▌   ▄▄▄· • ▌ ▄ ·.  ▄▄▄·                               
+               ▐█ ▌▪██•  ▐█ ▀█ ·██ ▐███▪▐█ ▄█                               
+               ██ ▄▄██▪  ▄█▀▀█ ▐█ ▌▐▌▐█· ██▀·                               
+               ▐███▌▐█▌▐▌▐█ ▪▐▌██ ██▌▐█▌▐█▪·•                               
+               ·▀▀▀ .▀▀▀  ▀  ▀ ▀▀  █▪▀▀▀.▀      
 
 
    :: Starting ::     
\ No newline at end of file
diff --git a/ui-react/nginx/nginx.conf b/ui-react/nginx/nginx.conf
new file mode 100644
index 000000000..758a646e5
--- /dev/null
+++ b/ui-react/nginx/nginx.conf
@@ -0,0 +1,17 @@
+server {
+
+  listen 80;
+
+  location / {
+    root   /usr/share/nginx/html;
+    index  index.html index.htm;
+    try_files $uri $uri/ /index.html;
+  }
+
+  error_page   500 502 503 504  /50x.html;
+
+  location = /50x.html {
+    root   /usr/share/nginx/html;
+  }
+
+}
\ No newline at end of file
diff --git a/ui-react/package.json b/ui-react/package.json
new file mode 100644
index 000000000..c8197d1e6
--- /dev/null
+++ b/ui-react/package.json
@@ -0,0 +1,27 @@
+{
+  "name": "clamp-ui",
+  "version": "0.0.1",
+  "description": "ONAP Clamp Designer UI",
+  "main": "index.js",
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test --env=jsdom",
+    "eject": "react-scripts eject"
+  },
+  "author": "ONAP Clamp Team",
+  "license": "Apache-2.0",
+  "dependencies": {
+    "json-editor": "^0.7.28",
+    "react": "~16.8.0",
+    "react-dom": "~16.8.0",
+    "react-scripts": "~3.0.1",
+    "onap-ui-react":"0.1.1"
+  },
+  "browserslist": [
+    ">0.2%",
+    "not dead",
+    "not ie <= 11",
+    "not op_mini all"
+  ]
+}
diff --git a/ui-react/public/index.html b/ui-react/public/index.html
new file mode 100644
index 000000000..85267426d
--- /dev/null
+++ b/ui-react/public/index.html
@@ -0,0 +1,18 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport"
+	content="width=device-width, initial-scale=1, shrink-to-fit=no">
+<meta name="theme-color" content="#000000">
+<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+<link rel="shortcut icon" href="%PUBLIC_URL%/onap.ico">
+
+<title>Clamp Designer UI</title>
+</head>
+<body>
+	<noscript>You need to enable JavaScript to run this app.</noscript>
+	<div id="root"></div>
+</body>
+</html>
diff --git a/ui-react/public/manifest.json b/ui-react/public/manifest.json
new file mode 100644
index 000000000..8210c4ee5
--- /dev/null
+++ b/ui-react/public/manifest.json
@@ -0,0 +1,15 @@
+{
+  "short_name": "Clamp Designer UI",
+  "name": "Clamp Designer UI",
+  "icons": [
+    {
+      "src": "onap.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}
diff --git a/ui-react/public/onap.ico b/ui-react/public/onap.ico
new file mode 100644
index 000000000..85e168ae2
--- /dev/null
+++ b/ui-react/public/onap.ico
diff --git a/ui-react/src/images/logo_onap_2017.png b/ui-react/src/images/logo_onap_2017.png
new file mode 100644
index 000000000..c6f6857a5
--- /dev/null
+++ b/ui-react/src/images/logo_onap_2017.png
diff --git a/ui-react/src/index.css b/ui-react/src/index.css
new file mode 100644
index 000000000..86e0f9e4b
--- /dev/null
+++ b/ui-react/src/index.css
@@ -0,0 +1,50 @@
+.nav {
+	margin-left: 2px; 
+	margin-right: 2px;
+}
+.navbar-brand {
+  float: left;
+  height: 50px;
+  padding: 15px 15px;
+  font-size: 18px;
+  line-height: 20px;
+}
+.rowC {
+	display: flex;
+	flex-direction:row;
+}
+.logo {
+	font-family: 'Trebuchet MS', cursive;
+	font-size: 20px;
+	font-weight: 500;
+	text-align: center;
+}
+.image_style {
+	display: inline-block; 
+	float: left;
+}
+.dummy {
+	float: right; 
+	padding-right: 50px;
+}
+.user_name {
+	display: block;
+	float: left;
+	font-family: 'Trebuchet MS', cursive;
+	font-size: 15px;
+	font-weight: 500;
+	height: 50px;
+	text-align: right;
+}
+
+.ClampHeader {
+	margin-left: 2px; 
+	margin-right: 2px;
+}
+
+.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
+    float: left;
+  }
+  .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
+    float: left;
+  }
\ No newline at end of file
diff --git a/ui-react/src/index.js b/ui-react/src/index.js
new file mode 100644
index 000000000..fed8c0f41
--- /dev/null
+++ b/ui-react/src/index.js
@@ -0,0 +1,46 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import './index.css';
+
+class UserBar extends React.Component {
+	render () {
+		const user = this.props.user;
+		return (
+			<div className="user_name">Hello:{user}
+			</div>
+		);
+	}
+}
+
+class ClampLogo extends React.Component {
+	render() {
+		return (
+			<div className="col-md-4 col-lg-4">
+				<img className="image_style" alt="" src={require('./images/logo_onap_2017.png')} 
+				height="50px"
+				width="234px"/>
+				<div className="navbar-brand logo">
+					&nbsp;&nbsp;
+					<b>CLAMP</b>
+				</div>
+			</div>
+		);
+	}
+}
+
+class ClampHeader extends React.Component {
+	render() {
+		return (
+			<div className='rowC'>
+			<ClampLogo />
+			<div className="dummy"></div>
+			<UserBar />
+			</div>
+		);
+	}
+}
+
+ReactDOM.render(
+	<ClampHeader />,
+	document.getElementById('root')
+)