From 84b04f862eecce9ac176714c672ca8444a6bc3c6 Mon Sep 17 00:00:00 2001
From: Yasar icli <hello@yasaricli.com>
Date: Thu, 7 Apr 2016 20:35:14 +0300
Subject: [PATCH] notifications and Build bundles.

---
 .meteor/packages                              |  6 +-
 .meteor/versions                              |  9 +-
 client/main.html                              |  1 +
 i18n/en.i18n.json                             |  8 +-
 imports/api/applications/applications.js      | 30 ++++---
 imports/api/applications/server/helpers.js    | 82 +++++++++++++++++--
 imports/api/applications/server/hooks.js      |  6 +-
 imports/api/applications/server/methods.js    | 15 +++-
 .../api/applications/server/publications.js   | 25 ++++++
 imports/api/applications/utils.js             |  5 +-
 imports/api/bundles/server/hooks.js           | 58 +------------
 imports/api/logs/server/hooks.js              | 19 ++++-
 imports/api/notifications/notifications.js    | 19 +++++
 imports/api/notifications/server/security.js  |  5 ++
 imports/startup/client/configuration.js       | 10 +++
 imports/startup/client/index.js               | 31 ++++---
 imports/startup/server/index.js               |  3 +
 imports/ui/components/applications/events.js  |  8 +-
 imports/ui/components/applications/helpers.js |  2 -
 .../ui/components/applications/rendered.js    |  2 -
 .../ui/components/applications/styles.less    | 20 ++++-
 .../ui/components/applications/templates.html | 14 +++-
 imports/ui/components/auth/events.js          |  2 -
 imports/ui/components/main/helpers.js         |  2 -
 imports/ui/components/main/styles.less        |  6 ++
 .../ui/components/notifications/rendered.js   | 10 +++
 .../components/notifications/templates.html   |  3 +
 27 files changed, 289 insertions(+), 112 deletions(-)
 create mode 100644 imports/api/notifications/notifications.js
 create mode 100644 imports/api/notifications/server/security.js
 create mode 100644 imports/ui/components/notifications/rendered.js
 create mode 100644 imports/ui/components/notifications/templates.html

diff --git a/.meteor/packages b/.meteor/packages
index f2ab96d..659a98f 100644
--- a/.meteor/packages
+++ b/.meteor/packages
@@ -28,7 +28,6 @@ iron:router
 aldeed:autoform
 cfs:standard-packages
 cfs:filesystem
-cfs:autoform
 less
 adriancbo:chalk
 zimme:active-route
@@ -66,3 +65,8 @@ momentjs:moment
 templates:tabs
 yasaricli:slugify
 ongoworks:security
+yogiben:autoform-file
+juliancwirko:s-alert
+juliancwirko:s-alert-slide
+cfs:power-queue
+froatsnook:sleep
diff --git a/.meteor/versions b/.meteor/versions
index d4b55e3..3d9953f 100644
--- a/.meteor/versions
+++ b/.meteor/versions
@@ -25,7 +25,6 @@ caching-compiler@1.0.3
 caching-html-compiler@1.0.5
 callback-hook@1.0.7
 cfs:access-point@0.1.49
-cfs:autoform@2.2.1
 cfs:base-package@0.0.30
 cfs:collection@0.5.5
 cfs:collection-filters@0.2.4
@@ -40,6 +39,7 @@ cfs:reactive-property@0.0.4
 cfs:standard-packages@0.5.9
 cfs:storage-adapter@0.2.3
 cfs:tempstore@0.1.5
+cfs:ui@0.1.3
 cfs:upload-http@0.0.20
 cfs:worker@0.1.4
 check@1.1.3
@@ -64,6 +64,7 @@ fastclick@1.0.10
 fileer:size@0.0.2
 flot:flot@0.8.3
 fortawesome:fontawesome@4.5.0
+froatsnook:sleep@1.2.0
 geojson-utils@1.0.7
 hitchcott:method-hooks@1.1.0
 hot-code-push@1.0.3
@@ -85,6 +86,8 @@ jparker:crypto-core@0.1.0
 jparker:crypto-md5@0.1.1
 jparker:gravatar@0.4.1
 jquery@1.11.7
+juliancwirko:s-alert@3.1.4
+juliancwirko:s-alert-slide@3.1.3
 kevohagan:sweetalert@1.0.0
 lai:collection-extensions@0.2.1_1
 launch-screen@1.0.10
@@ -117,6 +120,8 @@ momentjs:moment@2.12.0
 mongo@1.1.6
 mongo-id@1.0.3
 mongo-livedata@1.0.11
+mpowaga:jquery-fileupload@9.11.2
+mpowaga:jquery-ui-widget@1.11.4
 natestrauser:animate-css@3.5.1
 npm-bcrypt@0.7.8_2
 npm-mongo@1.4.42
@@ -130,7 +135,6 @@ pmteor:underscore-helpers@0.0.1
 pmteor:whirl@0.0.1
 promise@0.6.6
 raix:eventemitter@0.1.3
-raix:ui-dropped-event@0.0.7
 raix:ui-progress-circle@0.0.3
 random@1.0.8
 rate-limit@1.0.3
@@ -167,6 +171,7 @@ utilities:avatar@0.9.2
 webapp@1.2.7
 webapp-hashing@1.0.8
 yasaricli:slugify@0.0.7
+yogiben:autoform-file@0.4.2
 zimme:active-route@2.3.2
 zimme:collection-behaviours@1.1.3
 zimme:collection-timestampable@1.0.9
diff --git a/client/main.html b/client/main.html
index 2f037da..7fa619b 100644
--- a/client/main.html
+++ b/client/main.html
@@ -4,6 +4,7 @@
 </head>
 
 <template name="layout">
+  {{ > notifications }}
   <div class="wrapper">
     <header class="topnavbar-wrapper">
       <nav role="navigation" class="navbar topnavbar">
diff --git a/i18n/en.i18n.json b/i18n/en.i18n.json
index 0889072..e69ae8b 100644
--- a/i18n/en.i18n.json
+++ b/i18n/en.i18n.json
@@ -18,6 +18,7 @@
   "all": "All",
   "create": "Create",
   "update": "Update",
+  "build": "Build",
   "stop-and-update": "Stop Application And Update",
   "change-password": "Change Password",
   "log-out": "Log Out",
@@ -47,5 +48,10 @@
   "no-logs": "No Logs",
   "not-find-logs": "Could not find any logs.",
   "monitoring": "Monitoring",
-  "logs": "Logs"
+  "logs": "Logs",
+  "build-started": "<b>%s</b> is to build application started.",
+  "build-completed": "<b>%s</b> build is completed.",
+  "started-application": "<b>%s</b> application started successfully.",
+  "stopped-application": "<b>%s</b> stopped successfully.",
+  "errored-application": "<b>%s</b> application is errored."
 }
diff --git a/imports/api/applications/applications.js b/imports/api/applications/applications.js
index de3fbff..e347a21 100644
--- a/imports/api/applications/applications.js
+++ b/imports/api/applications/applications.js
@@ -7,6 +7,7 @@ import { Dev } from 'meteor/pmteor:dev';
 import Users from '../users/users.js';
 import { Logs } from '../logs/logs.js';
 import { Bundles } from '../bundles/bundles.js';
+import { Notifications } from '../notifications/notifications.js';
 
 import { STATUS_ALLOWED_VALUES, NODE_ENV_ALLOWED_VALUES, DEFAULT_NODE_ENV,
   STATUS_MAPPER } from './utils.js';
@@ -50,7 +51,6 @@ Applications.attachSchema(new SimpleSchema({
   'env.MAIL_URL': { type: String, optional: true },
   'env.PORT': { type: Number, optional: true },
   'env.DISABLE_WEBSOCKETS': { type: Number, optional: true },
-  'env.MONGO_OPLOG_URL': { type: String, optional: true },
 
   // RUNNING APPLICATION ENV VARIABLE
   'env.NODE_ENV': {
@@ -64,8 +64,10 @@ Applications.attachSchema(new SimpleSchema({
     label: 'Bundle',
     autoform: {
       afFieldInput: {
-        type: "cfs-file",
-        collection: "bundles"
+        type: 'fileUpload',
+        collection: 'bundles',
+        label: 'Choose application bundle file',
+        removeFileBtnTemplate: 'bundleRemoveFileBtn'
       }
     }
   }
@@ -100,6 +102,16 @@ Applications.helpers({
     });
   },
 
+  notifications(callback) {
+    return Notifications.find({
+      applicationId: this._id
+    }, callback);
+  },
+
+  notification({ type, message }) {
+    return Notifications.insert({ applicationId: this._id, type, message });
+  },
+
   bundle() {
     return Bundles.findOne(this.bundleId);
   },
@@ -108,14 +120,6 @@ Applications.helpers({
     return Dev.isDevelopmentReturned(`http://localhost:${this.env.PORT}`, this.env.ROOT_URL);
   },
 
-  setStatus(statusCode) {
-    return Applications.update(this._id, {
-      $set: {
-        status: STATUS_ALLOWED_VALUES[statusCode]
-      }
-    });
-  },
-
   isStop() {
     return _.isEqual(this.status, STATUS_MAPPER.STOP);
   },
@@ -130,5 +134,9 @@ Applications.helpers({
 
   isReady() {
     return _.isEqual(this.status, STATUS_MAPPER.READY);
+  },
+
+  isProgress() {
+    return _.isEqual(this.status, STATUS_MAPPER.PROGRESS);
   }
 });
diff --git a/imports/api/applications/server/helpers.js b/imports/api/applications/server/helpers.js
index f3f24ff..f0dd357 100644
--- a/imports/api/applications/server/helpers.js
+++ b/imports/api/applications/server/helpers.js
@@ -1,12 +1,14 @@
+import { TAPi18n } from 'meteor/tap:i18n';
 import { _ } from 'meteor/underscore';
 
 import Users from '../../users/users.js';
 import { Applications } from '../applications.js';
-import { BUNDLE_DIR } from '../../bundles/utils.js';
+import { BUNDLE_DIR, SYNC_EXEC_OPTIONS } from '../../bundles/utils.js';
 
 // NPM PACKAGES
 import pm2 from 'pm2';
 import freeport from 'freeport';
+import { cd, find, rm, exec, test } from 'shelljs';
 
 Applications.helpers({
   dir() {
@@ -27,9 +29,6 @@ Applications.helpers({
   start() {
     const self = this;
 
-    // RUNNING UPDATE
-    self.setStatus(1);
-
    /*
     * Listening port and connect production process manager. if connected
     * process manager and started application then change application status
@@ -68,6 +67,11 @@ Applications.helpers({
               });
             }
 
+            self.notification({
+              type: 'success',
+              message: TAPi18n.__('started-application', self.name)
+            });
+
             // DISCONNECT
             pm2.disconnect();
           }));
@@ -78,12 +82,76 @@ Applications.helpers({
 
   stop() {
     const self = this;
-    pm2.connect((connect_err) => {
-      pm2.stop(self.bundleId, (stop_err) => {
+    pm2.connect(Meteor.bindEnvironment(() => {
+      pm2.stop(self.bundleId, Meteor.bindEnvironment(() => {
+
+        self.notification({
+          type: 'success',
+          message: TAPi18n.__('stopped-application', self.name)
+        });
 
         // DISCONNECT
         pm2.disconnect();
-      });
+      }))
+    }));
+  },
+
+  // ##### --------- REBUILDING FIBERS -------------- #######
+  build() {
+
+    this.notification({
+      type: 'info',
+      message: TAPi18n.__('build-started', this.name)
+    });
+
+    // async sleep statements
+    Meteor.sleep(1000);
+
+    cd(`${this.dir()}/programs/server`);
+
+    // GO NPM PACKAGES
+    cd('npm');
+
+    // BINARY NPM MODULES
+    const bindingFiles = find('.').filter((file) => {
+      return file.match(/\.gyp$/);
+    });
+
+    bindingFiles.forEach((file) => {
+      const dir = file.replace('/binding.gyp', '');
+
+      // GO TO BINDING FILE DIR
+      cd(dir);
+
+      // REMOVE BEFORE MODULES
+      rm('-rf', 'node_modules');
+
+      // INSTALL MODULES
+      exec('npm install', SYNC_EXEC_OPTIONS);
+
+      // AND REBUILD BINDINGS PACKAGES.
+      exec('node-gyp rebuild', SYNC_EXEC_OPTIONS);
+
+      // PREV DIR
+      cd('-');
+    });
+
+    // PROGRAMS SERVER DIR
+    cd('..');
+
+    // support for 0.9
+    if (test('-e', 'package.json')) {
+
+      exec('npm install', SYNC_EXEC_OPTIONS);
+    } else {
+
+      // support for older versions
+      exec('npm install fibers bcrypt', SYNC_EXEC_OPTIONS);
+    }
+
+    this.notification({
+      type: 'success',
+      message: TAPi18n.__('build-completed', this.name)
     });
   },
 
diff --git a/imports/api/applications/server/hooks.js b/imports/api/applications/server/hooks.js
index a520e2e..7758f0a 100644
--- a/imports/api/applications/server/hooks.js
+++ b/imports/api/applications/server/hooks.js
@@ -3,6 +3,7 @@ import { _ } from 'meteor/underscore';
 import Users from '../../users/users.js';
 import { Logs } from '../../logs/logs.js';
 import { Applications } from '../applications.js';
+import { Notifications } from '../../notifications/notifications.js';
 
 import { BUNDLE_DIR } from '../../bundles/utils.js';
 
@@ -23,7 +24,10 @@ Applications.before.insert((userId, doc) => {
 Applications.after.remove((userId, doc) => {
 
   // Applications all logs removed.
-  Logs.remove({ applicationId: doc._id });
+  Logs.remove({ 'process.name': doc.bundleId });
+
+  // Notifications removed
+  Notifications.remove({ applicationId: doc._id });
 
   // CONNECT AND DELETE APPLICATION
   pm2.connect((connect_err) => {
diff --git a/imports/api/applications/server/methods.js b/imports/api/applications/server/methods.js
index 3efbfe3..700a577 100644
--- a/imports/api/applications/server/methods.js
+++ b/imports/api/applications/server/methods.js
@@ -26,7 +26,20 @@ const stopApplication = new ValidatedMethod({
   }
 });
 
+const buildApplication = new ValidatedMethod({
+  name: 'application.build',
+  mixins: [ hasApplicationMixin ],
+
+  run({ _id }) {
+    const application = Applications.findOne(_id);
+
+    // BULD APPLICATION
+    application.build();
+  }
+});
+
 export {
   stopApplication,
-  startApplication
+  startApplication,
+  buildApplication
 }
diff --git a/imports/api/applications/server/publications.js b/imports/api/applications/server/publications.js
index 8730788..ed93d77 100644
--- a/imports/api/applications/server/publications.js
+++ b/imports/api/applications/server/publications.js
@@ -3,6 +3,7 @@ import { Meteor } from 'meteor/meteor';
 // COLLECTIONS
 import Users from '../../users/users.js';
 import { Applications } from '../applications.js';
+import { Notifications } from '../../notifications/notifications.js';
 import { Logs } from '../../logs/logs.js';
 
 Meteor.publishComposite('applications', function() {
@@ -41,6 +42,18 @@ Meteor.publishComposite('applications', function() {
             }
           });
         }
+      },
+
+      // Notifications
+      {
+        find(application) {
+          return Notifications.find({
+            applicationId: application._id,
+            createdAt: {
+               $gt: new Date() // Publish current Date after .
+             }
+          });
+        }
       }
     ]
   }
@@ -80,6 +93,18 @@ Meteor.publishComposite('application', function(_id) {
             }
           });
         }
+      },
+
+      // Notifications
+      {
+        find(application) {
+          return Notifications.find({
+            applicationId: application._id,
+            createdAt: {
+               $gt: new Date() // Publish current Date after .
+            }
+          });
+        }
       }
     ]
   }
diff --git a/imports/api/applications/utils.js b/imports/api/applications/utils.js
index b79ecb9..326d2c0 100644
--- a/imports/api/applications/utils.js
+++ b/imports/api/applications/utils.js
@@ -8,7 +8,7 @@ const NODE_ENV_ALLOWED_VALUES = ['PMTEOR'];
 const [ DEFAULT_NODE_ENV ] = NODE_ENV_ALLOWED_VALUES;
 
 // ALLOW STATUS LIST
-const STATUS_ALLOWED_VALUES = ['STOP', 'EXIT', 'ONLINE', 'READY', 'ERRORED', 'RESTART', 'RESTART OVERLIMIT'];
+const STATUS_ALLOWED_VALUES = ['STOP', 'EXIT', 'ONLINE', 'READY', 'ERRORED', 'RESTART', 'RESTART OVERLIMIT', 'PROGRESS'];
 
 // MAPPER STATUS LIST
 const STATUS_MAPPER = {
@@ -17,7 +17,8 @@ const STATUS_MAPPER = {
   ONLINE: STATUS_ALLOWED_VALUES[2],
   READY: STATUS_ALLOWED_VALUES[3],
   ERRORED: STATUS_ALLOWED_VALUES[4],
-  RESTART: STATUS_ALLOWED_VALUES[2]
+  RESTART: STATUS_ALLOWED_VALUES[2],
+  PROGRESS: STATUS_ALLOWED_VALUES[7]
 }
 
 const hasApplicationMixin = (options) => {
diff --git a/imports/api/bundles/server/hooks.js b/imports/api/bundles/server/hooks.js
index 575c390..251c294 100644
--- a/imports/api/bundles/server/hooks.js
+++ b/imports/api/bundles/server/hooks.js
@@ -1,9 +1,8 @@
-import { Applications } from '../../applications/applications.js';
 import { Bundles } from '../bundles.js';
-import { BUNDLE_DIR, SYNC_EXEC_OPTIONS, ASYNC_EXEC_OPTIONS } from '../utils.js';
+import { BUNDLE_DIR, SYNC_EXEC_OPTIONS } from '../utils.js';
 
 // NPM PACKAGES
-import { rm, cd, mkdir, exec, test, find } from 'shelljs';
+import { cd, mkdir, exec } from 'shelljs';
 
 Bundles.on('stored', Meteor.bindEnvironment((file, storeName) => {
   const { _id } = file;
@@ -16,57 +15,4 @@ Bundles.on('stored', Meteor.bindEnvironment((file, storeName) => {
 
   // EXTRACT
   exec(`tar -xvzf ${_id}.tar.gz -C ${_id} --strip 1`, SYNC_EXEC_OPTIONS);
-
-  // --------- REBUILDING FIBERS --------------
-  cd(`${_id}/programs/server`);
-
-  // GO NPM PACKAGES
-  cd('npm');
-
-  // BINARY NPM MODULES
-  const bindingFiles = find('.').filter((file) => {
-    return file.match(/\.gyp$/);
-  });
-
-  bindingFiles.forEach((file) => {
-    const dir = file.replace('/binding.gyp', '');
-
-    // GO TO BINDING FILE DIR
-    cd(dir);
-
-    // REMOVE BEFORE MODULES
-    rm('-rf', 'node_modules');
-
-    // INSTALL MODULES
-    exec('npm install', SYNC_EXEC_OPTIONS);
-
-    // AND REBUILD BINDINGS PACKAGES.
-    exec('node-gyp rebuild', SYNC_EXEC_OPTIONS);
-
-    // PREV DIR
-    cd('-');
-  });
-
-  // PROGRAMS SERVER DIR
-  cd('..');
-
-  // support for 0.9
-  if (test('-e', 'package.json')) {
-
-    exec('npm install', SYNC_EXEC_OPTIONS);
-  } else {
-
-    // support for older versions
-    exec('npm install fibers bcrypt', SYNC_EXEC_OPTIONS);
-  }
-
-  // APPLICATION
-  const application = Applications.findOne({ bundleId: _id });
-
- /*
-  * IMPORTANT!!!!
-  * After installation is completed it will be updated before
-  * the start if the application fix begin.
-  */
-  application.setStatus(3);
 }));
diff --git a/imports/api/logs/server/hooks.js b/imports/api/logs/server/hooks.js
index b6beceb..e9c2355 100644
--- a/imports/api/logs/server/hooks.js
+++ b/imports/api/logs/server/hooks.js
@@ -1,15 +1,26 @@
+import { TAPi18n } from 'meteor/tap:i18n';
 import { Applications } from '../../applications/applications.js';
 import { Logs } from '../logs.js';
+import { LOG_TYPE_MAPPER } from '../utils.js';
 
 Logs.before.insert((userId, doc) => {
-  const application = Applications.findOne(doc.applicationId);
+  const application = Applications.findOne({
+    bundleId: doc.process.name
+  });
 
   // HAS APPLICATION
   if (application) {
 
     // SEND EMAILS
-    application.sendEmailMembers('log', {
-      application
-    });
+    application.sendEmailMembers('log', { application });
+
+    // TYPE ERROR THEN SEND NOTIFICATIONS
+    if (_.isEqual(doc.type, LOG_TYPE_MAPPER.ERRORED)) {
+
+      application.notification({
+        type: 'error',
+        message: TAPi18n.__('errored-application', application.name)
+      });
+    }
   }
 });
diff --git a/imports/api/notifications/notifications.js b/imports/api/notifications/notifications.js
new file mode 100644
index 0000000..45f558d
--- /dev/null
+++ b/imports/api/notifications/notifications.js
@@ -0,0 +1,19 @@
+import { Mongo } from 'meteor/mongo';
+import { SimpleSchema } from 'meteor/aldeed:simple-schema';
+
+export const Notifications = new Mongo.Collection('notifications');
+
+// Attach behaviour with the default options
+Notifications.attachBehaviour('timestampable');
+
+// SCHEMA
+Notifications.attachSchema(new SimpleSchema({
+  applicationId: { type: String },
+
+  type: {
+    type: String,
+    allowedValues: ['error', 'warning', 'info', 'success']
+  },
+
+  message: { type: String }
+}));
diff --git a/imports/api/notifications/server/security.js b/imports/api/notifications/server/security.js
new file mode 100644
index 0000000..2678489
--- /dev/null
+++ b/imports/api/notifications/server/security.js
@@ -0,0 +1,5 @@
+import { Notifications } from '../notifications.js';
+
+
+// NEVER CLIENT EVENTS.
+Notifications.permit(['insert', 'remove', 'update']).never().allowInClientCode();
diff --git a/imports/startup/client/configuration.js b/imports/startup/client/configuration.js
index bb48bd8..36d8043 100644
--- a/imports/startup/client/configuration.js
+++ b/imports/startup/client/configuration.js
@@ -68,3 +68,13 @@ AutoForm.addHooks(['InsertApplicationForm', 'UpdateApplicationForm'], {
     Modal.close();
   }
 });
+
+// The defaults are below:
+sAlert.config({
+    effect: 'slide',
+    position: 'bottom-right',
+    timeout: 5000,
+    html: true,
+    onRouteClose: true,
+    stack: true
+});
diff --git a/imports/startup/client/index.js b/imports/startup/client/index.js
index 48662e5..43bb879 100644
--- a/imports/startup/client/index.js
+++ b/imports/startup/client/index.js
@@ -1,20 +1,29 @@
-// MAIN
-import '../../ui/components/main/routers.js';
-import '../../ui/components/main/events.js';
-import '../../ui/components/main/helpers.js';
-import '../../ui/components/main/rendered.js';
+// TEMPLATES
+import '../../ui/components/main/templates.html';
+import '../../ui/components/auth/templates.html';
+import '../../ui/components/applications/templates.html';
+import '../../ui/components/notifications/templates.html';
 
-// AUTH
+// ROUTERS
+import '../../ui/components/main/routers.js';
 import '../../ui/components/auth/routers.js';
-import '../../ui/components/auth/events.js';
-import '../../ui/components/auth/helpers.js';
+import '../../ui/components/applications/routers.js';
+
+// RENDERED
+import '../../ui/components/main/rendered.js';
 import '../../ui/components/auth/rendered.js';
+import '../../ui/components/applications/rendered.js';
+import '../../ui/components/notifications/rendered.js';
 
-// APPLICATIONS
-import '../../ui/components/applications/routers.js';
+// EVENTS
+import '../../ui/components/main/events.js';
+import '../../ui/components/auth/events.js';
 import '../../ui/components/applications/events.js';
+
+// HELPERS
+import '../../ui/components/main/helpers.js';
+import '../../ui/components/auth/helpers.js';
 import '../../ui/components/applications/helpers.js';
-import '../../ui/components/applications/rendered.js';
 
 // CONFIG
 import './configuration.js';
diff --git a/imports/startup/server/index.js b/imports/startup/server/index.js
index 9583d28..f96a1e0 100644
--- a/imports/startup/server/index.js
+++ b/imports/startup/server/index.js
@@ -19,5 +19,8 @@ import '../../api/logs/server/security.js';
 import '../../api/logs/server/helpers.js';
 import '../../api/logs/server/hooks.js';
 
+// NOTIFICATIONS
+import '../../api/notifications/server/security.js';
+
 // USERS
 import '../../api/users/server/hooks.js';
diff --git a/imports/ui/components/applications/events.js b/imports/ui/components/applications/events.js
index 5cfb724..c4118d9 100644
--- a/imports/ui/components/applications/events.js
+++ b/imports/ui/components/applications/events.js
@@ -1,5 +1,3 @@
-import './templates.html';
-
 import { Meteor } from 'meteor/meteor';
 import { Template } from 'meteor/templating';
 import { Session } from 'meteor/session';
@@ -7,7 +5,6 @@ import { Modal } from 'meteor/pmteor:modal';
 import { TAPi18n } from 'meteor/tap:i18n';
 import { Applications } from '../../../api/applications/applications.js';
 
-
 Template.applications.events({
   'click .insert': Modal.open('insertApplication'),
   'click .name': Modal.open('updateApplication'),
@@ -22,6 +19,11 @@ Template.applications.events({
     Meteor.call('application.stop', { _id });
   },
 
+  'click .build'(event, instance) {
+    const { _id } = this;
+    Meteor.call('application.build', { _id });
+  },
+
   'click .delete'(event, instance) {
     swal({
       title: TAPi18n.__('are-you-sure-title'),
diff --git a/imports/ui/components/applications/helpers.js b/imports/ui/components/applications/helpers.js
index f88fcd0..aa9b67a 100644
--- a/imports/ui/components/applications/helpers.js
+++ b/imports/ui/components/applications/helpers.js
@@ -1,5 +1,3 @@
-import './templates.html';
-
 import { Template } from 'meteor/templating';
 import { Session } from 'meteor/session';
 import { TAPi18n } from 'meteor/tap:i18n';
diff --git a/imports/ui/components/applications/rendered.js b/imports/ui/components/applications/rendered.js
index 58abcaf..57e9764 100644
--- a/imports/ui/components/applications/rendered.js
+++ b/imports/ui/components/applications/rendered.js
@@ -1,5 +1,3 @@
-import './templates.html';
-
 import { Template } from 'meteor/templating';
 import { Applications } from '../../../api/applications/applications.js';
 import { Monitoring } from '../../lib/monitoring.js';
diff --git a/imports/ui/components/applications/styles.less b/imports/ui/components/applications/styles.less
index 83493eb..a9acee0 100644
--- a/imports/ui/components/applications/styles.less
+++ b/imports/ui/components/applications/styles.less
@@ -71,7 +71,7 @@
           &:extend(.bg-success);
         }
         &.STOP:extend(.bg-gray) {}
-        &.EXIT:extend(.bg-warning) {}
+        &.EXIT:extend(.bg-gray) {}
         &.READY:extend(.bg-yellow) {}
         &.ERRORED:extend(.bg-danger-dark) {}
       }
@@ -290,6 +290,24 @@
       height: 45px;
     }
   }
+
+  .js-af-select-file,
+  .btn-default {
+    width: 100%;
+    font-weight: 300;
+    font-size: 18px;
+  }
+
+  .js-af-remove-file {
+    border: 0px;
+    position: absolute;
+    width: auto;
+    top: 0px;
+    right: 0px;
+    padding-bottom: 8px;
+    border-top-left-radius: 0px;
+    border-bottom-left-radius: 0px;
+  }
 }
 
 .membersModal {
diff --git a/imports/ui/components/applications/templates.html b/imports/ui/components/applications/templates.html
index 9fd140f..15e90d4 100644
--- a/imports/ui/components/applications/templates.html
+++ b/imports/ui/components/applications/templates.html
@@ -13,13 +13,13 @@
     </div>
     <div class="list">
       {{# each apps }}
-        <div class="list-group">
+        <div class="list-group {{# if isProgress }}whirl pm-loading{{/if}}">
           <a href="{{ pathFor route='Application' }}" class="list-group-item">
             <table class="wd-wide">
               <tbody>
                 <tr>
                   <td class="wd-xs">
-                    <div class="ph status {{ status }} {{# if isExit }}whirl pm-loading{{/if}} {{# if isOnline }}onlineInOut{{/if}}"></div>
+                    <div class="ph status {{ status }} {{# if isOnline }}onlineInOut{{/if}}"></div>
                   </td>
                   <td>
                     <div class="ph url-container">
@@ -100,6 +100,8 @@
                           </li>
                           {{# if isOnline }}
                             <li><a href="#" class="stop">{{ _ "stop" }}</a></li>
+                          {{ else }}
+                            <li><a href="#" class="build">{{ _ "build" }}</a></li>
                           {{/if}}
                           {{# unless isOnline }}
                             {{# if isInRole 'admin' }}
@@ -339,13 +341,19 @@
         {{> afQuickField name='env.MONGO_URL' class='mb-lg form-control input-lg' placeholder='MONGO URL' label=false }}
         {{> afQuickField name='env.MAIL_URL' class='mb-lg form-control input-lg' placeholder='MAIL URL' label=false }}
         {{> afQuickField name='env.PORT' class='mb-lg form-control input-lg' placeholder='PORT' label=false }}
-        {{> afQuickField name="bundleId" label=false }}
         {{# if application.isOnline }}
           <a class="mb-sm btn btn-warning btn-lg stop">{{ _ "stop-and-update" }}</a>
         {{ else }}
+          {{> afQuickField name="bundleId" label=false }}
           <button type="submit" class="mb-sm btn btn-purple btn-lg">{{ _ "update" }}</button>
         {{/if}}
       {{/ autoForm }}
     </div>
   </div>
 </template>
+
+<template name="bundleRemoveFileBtn">
+  <button type="button" class="js-af-remove-file btn btn-default btn-danger">
+    {{ _ 'remove' }}
+  </button>
+</template>
diff --git a/imports/ui/components/auth/events.js b/imports/ui/components/auth/events.js
index fcc7a13..3188147 100644
--- a/imports/ui/components/auth/events.js
+++ b/imports/ui/components/auth/events.js
@@ -1,5 +1,3 @@
-import './templates.html';
-
 import { Template } from 'meteor/templating';
 import { AccountsTemplates } from 'meteor/useraccounts:core';
 
diff --git a/imports/ui/components/main/helpers.js b/imports/ui/components/main/helpers.js
index 1cab878..8098001 100644
--- a/imports/ui/components/main/helpers.js
+++ b/imports/ui/components/main/helpers.js
@@ -1,5 +1,3 @@
-import './templates.html';
-
 import { Template } from 'meteor/templating';
 import { Applications } from '../../../api/applications/applications.js';
 import { Logs } from '../../../api/logs/logs.js';
diff --git a/imports/ui/components/main/styles.less b/imports/ui/components/main/styles.less
index 0886a89..f91e876 100644
--- a/imports/ui/components/main/styles.less
+++ b/imports/ui/components/main/styles.less
@@ -183,3 +183,9 @@
     }
   }
 }
+
+.s-alert-box {
+  font-family: "Source Sans Pro", sans-serif;
+  font-weight: 200;
+  font-size: 18px;
+}
diff --git a/imports/ui/components/notifications/rendered.js b/imports/ui/components/notifications/rendered.js
new file mode 100644
index 0000000..91f87fd
--- /dev/null
+++ b/imports/ui/components/notifications/rendered.js
@@ -0,0 +1,10 @@
+import { Template } from 'meteor/templating';
+import { Notifications } from '../../../api/notifications/notifications.js';
+
+Template.notifications.onRendered(() => {
+  Notifications.find({}).observe({
+    added(doc) {
+      sAlert[doc.type](doc.message);
+    }
+  });
+});
diff --git a/imports/ui/components/notifications/templates.html b/imports/ui/components/notifications/templates.html
new file mode 100644
index 0000000..a516de3
--- /dev/null
+++ b/imports/ui/components/notifications/templates.html
@@ -0,0 +1,3 @@
+<template name="notifications">
+  {{> sAlert }}
+</template>