Che plugin viewer first working model

Dockerfile

@@ -0,0 +1,27 @@
+# Copyright (c) 2012-2018 Red Hat, Inc.
+#   This program and the accompanying materials are made
+#   available under the terms of the Eclipse Public License 2.0
+#   which is available at https://www.eclipse.org/legal/epl-2.0/
+#   SPDX-License-Identifier: EPL-2.0
+#   Contributors:
+#       Red Hat, Inc. - initial implementation
+
+FROM centos:7
+
+RUN printf "[nginx]\nname=nginx repo\nbaseurl=http://nginx.org/packages/centos/7/x86_64/\ngpgcheck=0\nenabled=1" > /etc/yum.repos.d/nginx.repo && \
+    curl --silent --location https://rpm.nodesource.com/setup_8.x | bash - && \
+    curl --silent --location https://dl.yarnpkg.com/rpm/yarn.repo | tee /etc/yum.repos.d/yarn.repo && \
+    yum install nginx nodejs yarn -y && \
+    yum clean all && \
+    sed -i 's/listen[[:space:]]*80;/listen 8080;/' /etc/nginx/conf.d/default.conf
+
+RUN chmod 777 /var/log/nginx && chmod 777 /var/cache/nginx && chmod 777 /var/run && rm -rf /var/log/nginx/* && rm -rf /var/cache/nginx/*
+ENV REACT_APP_REGISTRY_URL='https://che-plugin-registry.openshift.io/plugins/index.json'
+WORKDIR /opt/che-plugin-viewer
+ADD . /opt/che-plugin-viewer
+ADD deployment/nginx.conf /etc/nginx/nginx.conf
+
+RUN yarn --production --non-interactive && yarn install && yarn build
+
+EXPOSE 8080
+CMD ["nginx", "-g", "daemon off;"]

README.md

@@ -0,0 +1,23 @@
+# Che-Plugin-Viewer
+
+Browse plugins available for Eclipse Che.
+
+## Quick Setup
+
+**Note** If you do not have yarn installed run: `npm install -g yarn`
+
+Run the following commands:
+
+```
+yarn
+yarn start
+```
+
+## Deploy it on dev-cluster
+
+```
+docker build -t <dockerhub username>/<image name> .
+docker push <dockerhub username>/<image name>
+```
+
+Deploy on dev cluster using the above image.

deployment/nginx.conf

@@ -0,0 +1,35 @@
+# Copyright (c) 2012-2018 Red Hat, Inc.
+#   This program and the accompanying materials are made
+#   available under the terms of the Eclipse Public License 2.0
+#   which is available at https://www.eclipse.org/legal/epl-2.0/
+#   SPDX-License-Identifier: EPL-2.0
+#   Contributors:
+#       Red Hat, Inc. - initial implementation
+
+worker_processes 1;
+
+error_log stderr;
+
+events {
+    worker_connections 1024;
+}
+
+http {
+    include mime.types;
+    default_type application/octet-stream;
+
+    server {
+        listen 8080 default;
+        client_max_body_size 1m;
+        server_name _;
+
+        keepalive_timeout 65;
+
+        root   /opt/che-plugin-viewer/build;
+        index  index.html;
+
+        location / {
+            try_files $uri $uri/ /index.html =404;
+        }
+    }
+}

package.json

@@ -0,0 +1,66 @@
+{
+  "name": "@che-incubator/plugin-viewer",
+  "version": "0.0.1",
+  "private": true,
+  "dependencies": {
+    "axios": "0.18.0",
+    "classnames": "2.2.5",
+    "connected-react-router": "4.3.0",
+    "history": "4.7.2",
+    "js-yaml": "3.12.0",
+    "lodash.orderby": "4.6.0",
+    "numeral": "2.0.6",
+    "patternfly": "3.55.0",
+    "patternfly-react": "2.22.5",
+    "patternfly-react-extensions": "2.12.6",
+    "prop-types": "15.6.2",
+    "react": "16.4.0",
+    "react-dom": "16.4.0",
+    "react-redux": "5.0.6",
+    "react-router": "4.3.1",
+    "react-router-dom": "4.2.2",
+    "recompose": "0.26.0",
+    "redux": "4.0.0",
+    "redux-promise-middleware": "5.0.0",
+    "redux-thunk": "2.2.0",
+    "sortabular": "1.5.1",
+    "table-resolver": "3.2.0"
+  },
+  "devDependencies": {
+    "babel-eslint": "8.2.6",
+    "eslint": "4.19.1",
+    "eslint-plugin-patternfly-react": "0.1.1",
+    "ncp": "2.0.0",
+    "node-sass-chokidar": "1.3.0",
+    "npm-run-all": "4.1.3",
+    "prettier": "1.14.2",
+    "react-scripts": "1.1.4",
+    "source-map-explorer": "1.5.0"
+  },
+  "sassIncludes": {
+    "src": "--include-path src",
+    "patternflyReactExtensions": "--include-path node_modules/patternfly-react-extensions/dist/sass",
+    "patternflyReact": "--include-path node_modules/patternfly-react/dist/sass",
+    "patternfly": "--include-path node_modules/patternfly/dist/sass",
+    "bootstrap": "--include-path node_modules/bootstrap-sass/assets/stylesheets",
+    "fontAwesome": "--include-path node_modules/font-awesome-sass/assets/stylesheets"
+  },
+  "scripts": {
+    "copy-fonts": "ncp node_modules/patternfly/dist/fonts src/fonts",
+    "copy-img": "ncp node_modules/patternfly/dist/img src/img",
+    "build-css": "node-sass-chokidar src/ --output-style compressed $npm_package_sassIncludes_src $npm_package_sassIncludes_patternfly $npm_package_sassIncludes_patternflyReact $npm_package_sassIncludes_patternflyReactExtensions $npm_package_sassIncludes_bootstrap $npm_package_sassIncludes_fontAwesome -o src/",
+    "watch-css": "yarn build-css && node-sass-chokidar src/ --output-style compressed $npm_package_sassIncludes_src $npm_package_sassIncludes_patternfly $npm_package_sassIncludes_patternflyReact $npm_package_sassIncludes_patternflyReactExtensions $npm_package_sassIncludes_bootstrap $npm_package_sassIncludes_fontAwesome -o src/ --watch --recursive",
+    "build-js": "react-scripts build",
+    "start": "npm-run-all -p watch-css start:local",
+    "start:local": "react-scripts start",
+    "build": "yarn copy-fonts && yarn copy-img && yarn build-css && yarn build-js; yarn postbuild;",
+    "test": "yarn lint && react-scripts test --env=jsdom --watch",
+    "eject": "react-scripts eject",
+    "prettier": "prettier --write --single-quote --trailing-comma=none \"src/**/*.js\"",
+    "analyze": "source-map-explorer build/static/js/main.*",
+    "lint": "yarn lint:js",
+    "lint:js": "eslint --max-warnings 0 src",
+    "preinstall": "node -v; npm -v;",
+    "postbuild": "[ \"$BUILD_ENV\" != OCP ] && exit 0; yarn install --production --ignore-scripts --prefer-offline;"
+  }
+}

public/index.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en" class="layout-pf layout-pf-fixed">
+
+<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%/favicon.ico">
+  <title>Che Plugin Viewer</title>
+</head>
+
+<body>
+  <noscript>
+    You need to enable JavaScript to run this app.
+  </noscript>
+  <div id="root"></div>
+</body>
+
+</html>

public/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "Plugin Viewer",
+  "name": "Eclipse Che Plugin Viewer",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

src/api/pluginsApi.js

@@ -0,0 +1,32 @@
+/* 
+   Copyright (c) 2012-2018 Red Hat, Inc.
+    This program and the accompanying materials are made
+    available under the terms of the Eclipse Public License 2.0
+    which is available at https://www.eclipse.org/legal/epl-2.0/
+    SPDX-License-Identifier: EPL-2.0
+    Contributors:
+        Red Hat, Inc. - initial implementation
+*/
+
+import axios from 'axios';
+import jsyaml from 'js-yaml';
+class pluginsApi {
+    static async getAllPlugins() {
+        let data = [];
+            return await axios.get(process.env.REACT_APP_REGISTRY_URL).then(async response => {
+            for (let i = 0; i < response.data.length; i++) {
+                let url = 'https://che-plugin-registry.openshift.io' + response.data[i].links.self;
+                await axios.get(url).then(res => {
+                    data.push(jsyaml.load(res.data));
+                }).catch(error => {
+                    return error;
+                });
+            }
+            return data;
+        }).catch(error => {
+            return error;
+        });
+    }
+}
+
+export default pluginsApi;

src/app.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { withRouter } from 'react-router';
+import { routes } from './routes';
+
+import './app.css';
+import Nav from './components/nav';
+
+class App extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.menu = routes();
+  }
+
+  render() {
+    const { location, history } = this.props;
+    return <Nav routes={this.menu} location={location} history={history} />;
+  }
+}
+
+App.propTypes = {
+  history: PropTypes.object.isRequired,
+  location: PropTypes.object.isRequired
+};
+
+export default withRouter(App);