Merge #3552

3552: deps: bump dependencies to latest r=mbayopanda a=jniles

This PR bumps all dependencies to their latest version, except ui-router, which has major breaking changes for both an upgrade and a downgrade.

The major changes are:
 1. We removed all `@bower_components`  and replaced them with their native NPM counterparts.  This allows green-keeper to keep us up to date with different versions.  The one exception to this is angular-ui-router, as mentioned above.
 2. `gulp` has been upgraded to version 4!  If there was a performance increase, it was small.  However, this allows us to rewrite our gulpfile for better clarity.
 3. A ton of unused CSS has been pruned.  We don't use it anymore, so let us remove it.
 4. All `vendor` references have been removed.  We no longer use a vendor folder without bower.

Super awesome changes:
 1. When using `NODE_ENV=development`, the application bundles the unminified dependencies.  That means we have much better insight into what bugs are happening and less cryptic error message.

Co-authored-by: Jonathan Niles <jonathanwniles@gmail.com>

client/src/css/structure.css

@@ -984,4 +984,4 @@ a[disabled] {
   text-align: center;
   line-height: 100px;
   margin-bottom: 5px;
-}
+}

client/src/css/trialbalance.css

@@ -1,87 +1,8 @@
-.modal-table {
-  position : relative;
-  max-height: 400px;
-  height: 400px;
-}
-
-.modal-table table {
-  width: 100%;
-  border-collapse: collapse;
-}
-
-.modal-table table tr td:not(:first-child),
-.modal-table table tr th:not(:first-child) {
-  text-align: right;
-  padding-right : 0.5em;
-}
-
-.modal-table-body {
-  margin-top : 1px;
-}
-
-.modal-table-body table tr th,
-.modal-table-body table tr td {
-  width: 20%;
-  padding: 5px;
-  border: 1px solid black;
-}
-
-.modal-table-body table tr:first-child th,
-.modal-table-body table tr:first-child td {
-  border-top: 0;
-}
-
-
-.modal-table-body table tr td:first-child,
-.modal-table-body table tr th:first-child {
-  border-left: 0;
-}
-
-.modal-table-body table tr td:last-child,
-.modal-table-body table tr th:last-child {
-  border-right: 0;
-}
-
-.modal-table-head {
-  position: absolute;
-  top:0; left:0; right:0;
-  max-height:30px;
-}
-
-.modal-table .modal-table-head tr th {
-  color: #fff;
-  padding: 8px;
-}
-
-.modal-table-body {
-  position: absolute;
-  top : 31px; bottom:30px; left:0; right:0;
-  max-height: 350px;
-  overflow: auto;
-}
-
-.modal-table-foot {
-  border-left: 6px solid #fff;
-  position: absolute;
-  height: 30px;
-  bottom:0; right:0; left:0;
-  background-color: #fff;
-}
-
-.modal-header .modal-icons {
-  margin : 0 1em;
-}
-
 .modal-header h3 {
   display : inline-block;
   margin  : 0;
 }
 
-.modal-header .modal-print {
-  float: right;
-  margin: 5px;
-}
-
 .modal-table + .modal-footer {
   border:none;
   padding-top:0;
@@ -91,56 +12,6 @@
   margin : 0 1em;
 }
 
-.modal-icons {
-  display: inline-block;
-}
-
-.modal-icons label {
-  padding-left: 5px;
-}
-
-.modal-table-body .details {
-  font-size: 10px;
-}
-
-/* color reset */
-.modal-table.success,
-.modal-table.error,
-.modal-table.warn {
-  color : #000;
-}
-
-/* success / warning / error classes */
-
-.modal-table.success thead tr th {
-  background-color: #003F82;
-}
-
-.modal-table.success .modal-table-head tr {
-  background-color : rgb(0,63,130);
-}
-
-.modal-table.success .modal-table-body {
-  border-left : 6px solid rgba(0,63,130, 0.75);
-}
-
-.modal-table.warning .modal-table-head tr {
-  background-color : rgb(213,133, 17);
-}
-
-.modal-table.warning .modal-table-body {
-  border-left : 6px solid rgba(213,133, 17, 0.75);
-  opacity : 0.75%;
-}
-
-.modal-table.error .modal-table-head tr {
-  background-color : #8B0000;
-}
-
-.modal-table.error .modal-table-body {
-  border-left : 6px solid rgba(160,45,45,0.75);
-}
-
 /* trial balance print */
 
 .signatures {
@@ -163,6 +34,6 @@
   height: 50px;
 }
 
-.signature-box>label {
+.signature-box > label {
   margin-bottom: 25px;
 }

client/src/css/ui-grid.css

@@ -94,4 +94,3 @@
   color: white;
   background-color: blue;
 }
-

client/src/index.html

@@ -9,16 +9,12 @@
   <link rel="icon" href="assets/favicon.ico" type="image/x-icon">
 
   <!-- Compiled bootstrap style definition -->
-  <link rel="stylesheet" href="vendor/angular-ui-select/dist/select.css">
   <link rel="stylesheet" href="css/bhima-bootstrap.css">
-  <link rel="stylesheet" href="vendor/angular-ui-grid/ui-grid.min.css">
-  <link rel="stylesheet" href="vendor/components-font-awesome/css/font-awesome.min.css">
-  <link rel="stylesheet" href="css/bhima/bhima.min.css">
+  <link rel="stylesheet" href="css/bhima.min.css">
 </head>
 
 <body ng-app="bhima" ng-strict-di>
 
-
 <div
   id="app-container"
   class="flex-container"

client/src/js/app.js

@@ -203,6 +203,9 @@ function httpConfig($httpProvider) {
 
   // register error handling interceptor
   $httpProvider.interceptors.push('ErrorInterceptor');
+
+  // perf - applyAsync
+  $httpProvider.useApplyAsync(true);
 }
 
 /**

client/src/js/components/bhAccountReferenceTypeSelect.js

@@ -10,20 +10,18 @@ angular.module('bhima.components')
     },
   });
 
-AccountReferenceTypeSelectController.$inject = ['AccountReferenceTypeService', '$translate'];
+AccountReferenceTypeSelectController.$inject = ['AccountReferenceTypeService'];
 
 /**
  * Account Reference Type selection component
  */
-function AccountReferenceTypeSelectController(AccountReferenceType, $translate) {
+function AccountReferenceTypeSelectController(AccountReferenceType) {
   const $ctrl = this;
 
   $ctrl.$onInit = function onInit() {
     AccountReferenceType.read()
       .then(accountReferenceTypes => {
-        accountReferenceTypes.forEach((item) => {
-          item.label = $translate.instant(item.label);
-        });
+        AccountReferenceType.translateLabel(accountReferenceTypes);
 
         $ctrl.accountReferenceTypes = accountReferenceTypes;
       });

client/src/js/components/bhCashboxUsers.js

@@ -13,12 +13,15 @@ bhCashboxUsers.$inject = ['CashboxService'];
 function bhCashboxUsers(Cashboxes) {
   const $ctrl = this;
 
-  // track intiial load to allow good empty user experience
-  $ctrl.initialLoad = false;
+  $ctrl.$onInit = () => {
+    // track intiial load to allow good empty user experience
+    $ctrl.initialLoad = false;
+  };
+
 
-  function _loadCashboxUsers(cashbox) {
+  function loadCashboxUsers(cashbox) {
     Cashboxes.users.read(cashbox)
-      .then((users) => {
+      .then(users => {
         $ctrl.initialLoad = true;
         $ctrl.users = users;
       });
@@ -28,7 +31,7 @@ function bhCashboxUsers(Cashboxes) {
   // this to be set any time
   $ctrl.$onChanges = function onChanges(changes) {
     if (changes.cashbox && changes.cashbox.currentValue) {
-      _loadCashboxUsers(changes.cashbox.currentValue);
+      loadCashboxUsers(changes.cashbox.currentValue);
     }
   };
 }

client/src/js/components/bhMultipleDepotSelect.js

@@ -25,9 +25,6 @@ function MultipleDepotSelectController(Depots, Notify) {
     // label to display
     $ctrl.label = $ctrl.label || 'STOCK.DEPOT';
 
-    // fired when the depots has been selected
-    $ctrl.onSelectCallback = $ctrl.onSelectCallback || angular.noop;
-
     // default for form name
     $ctrl.formName = $ctrl.formName || 'DepotForm';
 
@@ -36,15 +33,15 @@ function MultipleDepotSelectController(Depots, Notify) {
 
     // load all Depot
     Depots.read()
-      .then((depots) => {
+      .then(depots => {
         $ctrl.depots = depots;
       })
       .catch(Notify.handleError);
   };
 
 
   // fires the onChange bound to the component boundary
-  $ctrl.handleChange = function (models) {
-    $ctrl.onChange({ depots : models });
+  $ctrl.handleChange = (depots) => {
+    $ctrl.onChange({ depots });
   };
 }

client/src/js/services/NotifyService.js

@@ -1,5 +1,5 @@
 angular.module('bhima.services')
-.service('NotifyService', NotifyService);
+  .service('NotifyService', NotifyService);
 
 NotifyService.$inject = ['$translate'];
 
@@ -10,43 +10,43 @@ NotifyService.$inject = ['$translate'];
  * @todo  unit tests
  */
 function NotifyService($translate) {
-  var service = this;
+  const service = this;
 
   // default time to live of 3 seconds
-  var TTL = 3000;
+  const TTL = 3000;
 
   // this will be used to specify how long a major error will be displayed,
   // these errors are usually out of the control of the user, they will probably
   // only be resolved by system administrators/ restarting the system (resulting
   // in a refreshed page)
-  var ERROR_TTL = 60000;
+  const ERROR_TTL = 60000;
 
   // this stores all notification instances - for now this will only be allowed
   // to store one notification however it can be extended in the future
-  var notifications = [];
+  const notifications = [];
 
-  var formatOptions = {
+  const formatOptions = {
     // success : 'notification-success',
     success : {
       format  : 'notification-success',
-      icon    : 'glyphicon-check'
+      icon    : 'glyphicon-check',
     },
     danger : {
       format  : 'notification-danger',
-      icon    : 'glyphicon-exclamation-sign'
+      icon    : 'glyphicon-exclamation-sign',
     },
     info : {
       format  : 'notification-info',
-      icon    : 'glyphicon-info-sign'
+      icon    : 'glyphicon-info-sign',
     },
     warn : {
       format  : 'notification-warn',
-      icon    : 'glyphicon-warning-sign'
+      icon    : 'glyphicon-warning-sign',
     },
     error : {
       format  : 'notification-error',
-      icon    : 'glyphicon-remove-sign'
-    }
+      icon    : 'glyphicon-remove-sign',
+    },
   };
 
   // alias styles
@@ -91,13 +91,13 @@ function NotifyService($translate) {
 
   /** @todo analysis on the heap allocation implications should be done this */
   function setNotification(key, ttl, options) {
-    var message = $translate.instant(key);
+    const message = $translate.instant(key);
 
     // if the request has overridden the time to live, use that, otherwise use the global default
     ttl = ttl || TTL;
-    var formatNotification = {
-      ttl : ttl,
-      message : message
+    const formatNotification = {
+      ttl,
+      message,
     };
 
     angular.extend(formatNotification, options);

client/src/less/bhima-bootstrap.less

@@ -465,3 +465,4 @@ div.ui-grid-cell .form-group.has-error input.ng-invalid {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+