Updates

app/assets/javascripts/app/directives/views/componentModal.js

@@ -21,7 +21,7 @@ class ComponentModal {
     $scope.dismiss = function(callback) {
       $scope.el.remove();
       $scope.$destroy();
-      $scope.onDismiss && $scope.onDismiss()($scope.component);
+      $scope.onDismiss && $scope.onDismiss() && $scope.onDismiss()($scope.component);
       callback && callback();
     }
   }

app/assets/javascripts/app/directives/views/componentView.js

@@ -17,7 +17,7 @@ class ComponentView {
 
     $scope.identifier = "component-view-" + Math.random();
 
-    console.log("Registering handler", $scope.identifier, $scope.component.name);
+    // console.log("Registering handler", $scope.identifier, $scope.component.name);
 
     this.componentManager.registerHandler({identifier: $scope.identifier, areas: [$scope.component.area], activationHandler: (component) => {
       if(component.active) {
@@ -86,7 +86,7 @@ class ComponentView {
     }
 
     $scope.$on("$destroy", function() {
-      console.log("Deregistering handler", $scope.identifier, $scope.component.name);
+      // console.log("Deregistering handler", $scope.identifier, $scope.component.name);
       componentManager.deregisterHandler($scope.identifier);
       if($scope.component && !$scope.manualDealloc) {
         componentManager.deactivateComponent($scope.component);

app/assets/javascripts/app/services/componentManager.js

@@ -278,6 +278,8 @@ class ComponentManager {
       this.handleToggleComponentMessage(component, componentToToggle, message);
     } else if(message.action === "request-permissions") {
       this.handleRequestPermissionsMessage(component, message);
+    } else if(message.action === "install-local-component") {
+      this.handleInstallLocalComponentMessage(component, message);
     }
 
     // Notify observers
@@ -516,6 +518,16 @@ class ComponentManager {
     }
   }
 
+  handleInstallLocalComponentMessage(sourceComponent, message) {
+    // Only extensions manager has this permission
+    if(!this.sysExtManager.isSystemExtension(sourceComponent)) {
+      return;
+    }
+
+    let targetComponent = this.modelManager.findItem(message.data.uuid);
+    this.desktopManager.installComponent(targetComponent);
+  }
+
   runWithPermissions(component, requiredPermissions, runFunction) {
 
     if(!component.permissions) {
@@ -625,28 +637,10 @@ class ComponentManager {
   openModalComponent(component) {
     var scope = this.$rootScope.$new(true);
     scope.component = component;
-    scope.onDismiss = () => {
-
-    }
     var el = this.$compile( "<component-modal component='component' class='modal'></component-modal>" )(scope);
     angular.element(document.body).append(el);
   }
 
-  installComponent(url) {
-    var name = getParameterByName("name", url);
-    var area = getParameterByName("area", url);
-    var component = this.modelManager.createItem({
-      content_type: "SN|Component",
-      url: url,
-      name: name,
-      area: area
-    })
-
-    this.modelManager.addItem(component);
-    component.setDirty(true);
-    this.syncManager.sync("installComponent");
-  }
-
   activateComponent(component) {
     var didChange = component.active != true;
 

app/assets/javascripts/app/services/desktopManager.js

@@ -37,7 +37,6 @@ class DesktopManager {
 
   // All `components` should be installed
   syncComponentsInstallation(components) {
-    // console.log("Web Syncing Components", components);
     if(!this.isDesktop) return;
 
     var data = components.map((component) => {
@@ -46,18 +45,22 @@ class DesktopManager {
     this.installationSyncHandler(data);
   }
 
-  desktop_onComponentInstallationComplete(componentData) {
-    console.log("Web|Component Installation Complete", componentData);
-    var component = this.modelManager.mapResponseItemsToLocalModels([componentData], ModelManager.MappingSourceDesktopInstalled)[0];
-    component.setDirty(true);
-    this.syncManager.sync("desktop_onComponentInstallationComplete");
+  installComponent(component) {
+    this.installComponentHandler(this.convertComponentForTransmission(component));
   }
 
-  desktop_updateComponentComplete(componentData) {
-    console.log("Web|Component Update Complete", componentData);
-    var component = this.modelManager.mapResponseItemsToLocalModels([componentData], ModelManager.MappingSourceDesktopInstalled)[0];
+  desktop_onComponentInstallationComplete(componentData, error) {
+    console.log("Web|Component Installation/Update Complete", componentData, error);
+    var component = this.modelManager.findItem(componentData.uuid);
+    if(error) {
+      component = this.modelManager.findItem(componentData.uuid);
+      component.setAppDataItem("installError", error);
+    } else {
+      component = this.modelManager.mapResponseItemsToLocalModels([componentData], ModelManager.MappingSourceDesktopInstalled)[0];
+      component.setAppDataItem("installError", null);
+    }
     component.setDirty(true);
-    this.syncManager.sync("desktop_updateComponentComplete");
+    this.syncManager.sync("onComponentInstallationComplete");
   }
 
   /* Used to resolve "sn://" */
@@ -69,8 +72,8 @@ class DesktopManager {
     this.installationSyncHandler = handler;
   }
 
-  desktop_setOfflineComponentInstallationHandler(handler) {
-    this.componentInstallationHandler = handler;
+  desktop_setInstallComponentHandler(handler) {
+    this.installComponentHandler = handler;
   }
 
   desktop_setInitialDataLoadHandler(handler) {