🎨 [Frontend] Enh: Converstations

services/static-webserver/client/source/class/osparc/dashboard/NewPlusMenu.js

@@ -161,7 +161,9 @@ qx.Class.define("osparc.dashboard.NewPlusMenu", {
     __addItems: function() {
       this.__addUIConfigItems();
       if (osparc.store.StaticInfo.getInstance().isDevFeaturesEnabled()) {
-        this.__addHypertools();
+        if (osparc.product.Utils.isS4LProduct()) {
+          this.__addHypertools();
+        }
         this.__addOtherTabsAccess();
       }
       this.getChildControl("new-folder");

services/static-webserver/client/source/class/osparc/dashboard/ResourceDetails.js

@@ -522,14 +522,8 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
       this.__addOpenButton(page);
 
       const lazyLoadContent = () => {
-        const commentsList = new osparc.info.CommentsList(resourceData["uuid"]);
-        page.addToContent(commentsList);
-        if (osparc.data.model.Study.canIWrite(resourceData["accessRights"])) {
-          const addComment = new osparc.info.CommentAdd(resourceData["uuid"]);
-          addComment.setPaddingLeft(10);
-          addComment.addListener("commentAdded", () => commentsList.fetchComments());
-          page.addToFooter(addComment);
-        }
+        const conversations = new osparc.info.Conversations(resourceData);
+        page.addToContent(conversations);
       }
       page.addListenerOnce("appear", lazyLoadContent, this);
 
@@ -545,23 +539,23 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
 
       const lazyLoadContent = () => {
         const resourceData = this.__resourceData;
-        let permissionsView = null;
+        let collaboratorsView = null;
         if (osparc.utils.Resources.isService(resourceData)) {
-          permissionsView = new osparc.share.CollaboratorsService(resourceData);
-          permissionsView.addListener("updateAccessRights", e => {
+          collaboratorsView = new osparc.share.CollaboratorsService(resourceData);
+          collaboratorsView.addListener("updateAccessRights", e => {
             const updatedData = e.getData();
             if (osparc.utils.Resources.isService(resourceData)) {
               this.fireDataEvent("updateService", updatedData);
             }
           }, this);
         } else {
-          permissionsView = new osparc.share.CollaboratorsStudy(resourceData);
+          collaboratorsView = new osparc.share.CollaboratorsStudy(resourceData);
           if (osparc.utils.Resources.isStudy(resourceData)) {
-            permissionsView.getChildControl("study-link").show();
+            collaboratorsView.getChildControl("study-link").show();
           } else if (osparc.utils.Resources.isTemplate(resourceData)) {
-            permissionsView.getChildControl("template-link").show();
+            collaboratorsView.getChildControl("template-link").show();
           }
-          permissionsView.addListener("updateAccessRights", e => {
+          collaboratorsView.addListener("updateAccessRights", e => {
             const updatedData = e.getData();
             if (osparc.utils.Resources.isStudy(resourceData)) {
               this.fireDataEvent("updateStudy", updatedData);
@@ -570,7 +564,7 @@ qx.Class.define("osparc.dashboard.ResourceDetails", {
             }
           }, this);
         }
-        page.addToContent(permissionsView);
+        page.addToContent(collaboratorsView);
       }
       page.addListenerOnce("appear", lazyLoadContent, this);
 

services/static-webserver/client/source/class/osparc/dashboard/StudyBrowserHeader.js

@@ -417,10 +417,10 @@ qx.Class.define("osparc.dashboard.StudyBrowserHeader", {
 
     __openShareWith: function() {
       const workspace = osparc.store.Workspaces.getInstance().getWorkspace(this.getCurrentWorkspaceId());
-      const permissionsView = new osparc.share.CollaboratorsWorkspace(workspace);
+      const collaboratorsView = new osparc.share.CollaboratorsWorkspace(workspace);
       const title = this.tr("Share Workspace");
-      const win = osparc.ui.window.Window.popUpInWindow(permissionsView, title, 500, 400);
-      permissionsView.addListener("updateAccessRights", () => {
+      const win = osparc.ui.window.Window.popUpInWindow(collaboratorsView, title, 500, 400);
+      collaboratorsView.addListener("updateAccessRights", () => {
         win.close();
         this.__updateShareInfo(workspace.getAccessRights());
       }, this);

services/static-webserver/client/source/class/osparc/dashboard/WorkspaceButtonItem.js

@@ -293,10 +293,10 @@ qx.Class.define("osparc.dashboard.WorkspaceButtonItem", {
     },
 
     __openShareWith: function() {
-      const permissionsView = new osparc.share.CollaboratorsWorkspace(this.getWorkspace());
+      const collaboratorsView = new osparc.share.CollaboratorsWorkspace(this.getWorkspace());
       const title = this.tr("Share Workspace");
-      osparc.ui.window.Window.popUpInWindow(permissionsView, title, 500, 400);
-      permissionsView.addListener("updateAccessRights", () => this.__applyAccessRights(this.getWorkspace().getAccessRights()), this);
+      osparc.ui.window.Window.popUpInWindow(collaboratorsView, title, 500, 400);
+      collaboratorsView.addListener("updateAccessRights", () => this.__applyAccessRights(this.getWorkspace().getAccessRights()), this);
     },
 
     __trashWorkspaceRequested: function() {

services/static-webserver/client/source/class/osparc/desktop/WorkbenchView.js

@@ -438,6 +438,19 @@ qx.Class.define("osparc.desktop.WorkbenchView", {
 
       this.__addTopBarSpacer(topBar);
 
+      if (osparc.utils.DisabledPlugins.isConversationEnabled()) {
+        const commentsButton = new qx.ui.form.Button().set({
+          appearance: "form-button-outlined",
+          toolTipText: this.tr("Conversations"),
+          icon: "@FontAwesome5Solid/comments/16",
+          marginRight: 10,
+          marginTop: 7,
+          ...osparc.navigation.NavigationBar.BUTTON_OPTIONS
+        });
+        commentsButton.addListener("execute", () => osparc.info.Conversations.popUpInWindow(study.serialize()));
+        topBar.add(commentsButton);
+      }
+
       const startAppButtonTB = this.__startAppButtonTB = new qx.ui.form.Button().set({
         appearance: "form-button-outlined",
         label: this.tr("App Mode"),

services/static-webserver/client/source/class/osparc/editor/AnnotationNoteCreator.js

@@ -18,9 +18,11 @@
 qx.Class.define("osparc.editor.AnnotationNoteCreator", {
   extend: qx.ui.core.Widget,
 
-  construct: function() {
+  construct: function(study) {
     this.base(arguments);
 
+    this.__study = study;
+
     this._setLayout(new qx.ui.layout.VBox(10));
 
     this.getChildControl("instructions");
@@ -86,16 +88,48 @@ qx.Class.define("osparc.editor.AnnotationNoteCreator", {
           control.addListener("execute", () => {
             const currentStudy = osparc.store.Store.getInstance().getCurrentStudy().serialize();
             currentStudy["resourceType"] = "study";
-            const collaboratorsManager = new osparc.share.NewCollaboratorsManager(currentStudy, false);
-            collaboratorsManager.setCaption("Recipient");
-            collaboratorsManager.getActionButton().setLabel(this.tr("Add"));
-            collaboratorsManager.addListener("addCollaborators", e => {
-              const {
-                selectedGids,
-              } = e.getData();
-              if (selectedGids) {
-                collaboratorsManager.close();
-                this.__setRecipientGid(selectedGids[0]);
+            const recipientsManager = new osparc.share.NewCollaboratorsManager(currentStudy, false, false);
+            recipientsManager.setCaption("Recipient");
+            recipientsManager.getActionButton().setLabel(this.tr("Add"));
+            recipientsManager.addListener("addCollaborators", e => {
+              const data = e.getData();
+              const recipientGids = data["selectedGids"];
+
+              if (recipientGids && recipientGids.length) {
+                const recipientGid = parseInt(recipientGids[0]);
+                this.__setRecipientGid(recipientGid);
+                recipientsManager.close();
+
+                const currentAccessRights = this.__study.getAccessRights();
+                const proposeSharing = [];
+                if (!(parseInt(recipientGid) in currentAccessRights)) {
+                  proposeSharing.push(recipientGid);
+                }
+                if (proposeSharing.length) {
+                  const collaboratorsManager = new osparc.share.NewCollaboratorsManager(currentStudy, false, true, proposeSharing);
+                  collaboratorsManager.addListener("addCollaborators", ev => {
+                    const {
+                      selectedGids,
+                      newAccessRights,
+                    } = ev.getData();
+                    const newCollaborators = {};
+                    selectedGids.forEach(gid => {
+                      newCollaborators[gid] = newAccessRights;
+                    });
+                    const studyData = this.__study.serialize();
+                    osparc.store.Study.addCollaborators(studyData, newCollaborators)
+                      .then(() => {
+                        const potentialCollaborators = osparc.store.Groups.getInstance().getPotentialCollaborators()
+                        selectedGids.forEach(gid => {
+                          if (gid in potentialCollaborators && "getUserId" in potentialCollaborators[gid]) {
+                            const uid = potentialCollaborators[gid].getUserId();
+                            osparc.notification.Notifications.postNewStudy(uid, studyData["uuid"]);
+                          }
+                        });
+                      })
+                      .finally(() => collaboratorsManager.close());
+                  });
+                }
               }
             }, this);
           }, this);

services/static-webserver/client/source/class/osparc/info/CommentUI.js

@@ -65,6 +65,7 @@ qx.Class.define("osparc.info.CommentUI", {
           control = new qx.ui.container.Composite(new qx.ui.layout.HBox(5).set({
             alignX: this.__isMyComment() ? "right" : "left"
           }));
+          control.addAt(new qx.ui.basic.Label("-"), 1);
           this._add(control, {
             row: 0,
             column: 1
@@ -74,17 +75,17 @@ qx.Class.define("osparc.info.CommentUI", {
           control = new qx.ui.basic.Label().set({
             font: "text-12"
           });
-          this.getChildControl("header-layout").addAt(control, 0);
+          this.getChildControl("header-layout").addAt(control, this.__isMyComment() ? 2 : 0);
           break;
         case "last-updated":
           control = new qx.ui.basic.Label().set({
             font: "text-12"
           });
-          this.getChildControl("header-layout").addAt(control, 1);
+          this.getChildControl("header-layout").addAt(control, this.__isMyComment() ? 0 : 2);
           break;
         case "comment-content":
           control = new osparc.ui.markdown.Markdown().set({
-            backgroundColor: "background-main-2",
+            // backgroundColor: "background-main-2",
             decorator: "rounded",
             noMargin: true,
             paddingLeft: 8,

services/static-webserver/client/source/class/osparc/info/CommentsList.js → services/static-webserver/client/source/class/osparc/info/Conversations.js

@@ -16,16 +16,16 @@
 ************************************************************************ */
 
 
-qx.Class.define("osparc.info.CommentsList", {
+qx.Class.define("osparc.info.Conversations", {
   extend: qx.ui.core.Widget,
 
   /**
-    * @param studyId {String} Study Id
+    * @param studyData {String} Study Data
     */
-  construct: function(studyId) {
+  construct: function(studyData) {
     this.base(arguments);
 
-    this.__studyId = studyId;
+    this.__studyData = studyData;
 
     this._setLayout(new qx.ui.layout.VBox(10));
 
@@ -34,7 +34,19 @@ qx.Class.define("osparc.info.CommentsList", {
     this.fetchComments();
   },
 
+  statics: {
+    popUpInWindow: function(studyData) {
+      const conversations = new osparc.info.Conversations(studyData);
+      const title = qx.locale.Manager.tr("Conversations");
+      const viewWidth = 600;
+      const viewHeight = 700;
+      const win = osparc.ui.window.Window.popUpInWindow(conversations, title, viewWidth, viewHeight);
+      return win;
+    },
+  },
+
   members: {
+    __studyData: null,
     __nextRequestParams: null,
 
     _createChildControlImpl: function(id) {
@@ -50,13 +62,23 @@ qx.Class.define("osparc.info.CommentsList", {
           control = new qx.ui.container.Composite(new qx.ui.layout.VBox(5)).set({
             alignY: "middle"
           });
-          this._add(control);
+          this._add(control, {
+            flex: 1
+          });
           break;
         case "load-more-button":
           control = new osparc.ui.form.FetchButton(this.tr("Load more comments..."));
           control.addListener("execute", () => this.fetchComments(false));
           this._add(control);
           break;
+        case "add-comment":
+          if (osparc.data.model.Study.canIWrite(this.__studyData["accessRights"])) {
+            control = new osparc.info.CommentAdd(this.__studyData["uuid"]);
+            control.setPaddingLeft(10);
+            control.addListener("commentAdded", () => this.fetchComments());
+            this._add(control);
+          }
+          break;
       }
 
       return control || this.base(arguments, id);
@@ -66,6 +88,7 @@ qx.Class.define("osparc.info.CommentsList", {
       this.getChildControl("title");
       this.getChildControl("comments-list");
       this.getChildControl("load-more-button");
+      this.getChildControl("add-comment");
     },
 
     fetchComments: function(removeComments = true) {
@@ -92,7 +115,7 @@ qx.Class.define("osparc.info.CommentsList", {
     __getNextRequest: function() {
       const params = {
         url: {
-          studyId: this.__studyId,
+          studyId: this.__studyData["uuid"],
           offset: 0,
           limit: 20
         }

services/static-webserver/client/source/class/osparc/info/ServiceLarge.js

@@ -505,8 +505,8 @@ qx.Class.define("osparc.info.ServiceLarge", {
     },
 
     __openAccessRights: function() {
-      const permissionsView = osparc.info.ServiceUtils.openAccessRights(this.getService());
-      permissionsView.addListener("updateAccessRights", e => {
+      const collaboratorsView = osparc.info.ServiceUtils.openAccessRights(this.getService());
+      collaboratorsView.addListener("updateAccessRights", e => {
         const updatedServiceData = e.getData();
         this.setService(updatedServiceData);
         this.fireDataEvent("updateService", updatedServiceData);

services/static-webserver/client/source/class/osparc/info/ServiceUtils.js

@@ -367,10 +367,10 @@ qx.Class.define("osparc.info.ServiceUtils", {
       * @param serviceData {Object} Serialized Service Object
       */
     openAccessRights: function(serviceData) {
-      const permissionsView = new osparc.share.CollaboratorsService(serviceData);
+      const collaboratorsView = new osparc.share.CollaboratorsService(serviceData);
       const title = qx.locale.Manager.tr("Share with Collaborators and Organizations");
-      osparc.ui.window.Window.popUpInWindow(permissionsView, title, 400, 300);
-      return permissionsView;
+      osparc.ui.window.Window.popUpInWindow(collaboratorsView, title, 400, 300);
+      return collaboratorsView;
     },
 
     /**

services/static-webserver/client/source/class/osparc/info/StudyLarge.js

@@ -226,8 +226,8 @@ qx.Class.define("osparc.info.StudyLarge", {
     __openAccessRights: function() {
       const studyData = this.getStudy().serialize();
       studyData["resourceType"] = this.__isTemplate ? "template" : "study";
-      const permissionsView = osparc.info.StudyUtils.openAccessRights(studyData);
-      permissionsView.addListener("updateAccessRights", e => {
+      const collaboratorsView = osparc.info.StudyUtils.openAccessRights(studyData);
+      collaboratorsView.addListener("updateAccessRights", e => {
         const updatedData = e.getData();
         this.getStudy().setAccessRights(updatedData["accessRights"]);
         this.fireDataEvent("updateStudy", updatedData);

services/static-webserver/client/source/class/osparc/jobs/RunsTableModel.js

@@ -50,6 +50,10 @@ qx.Class.define("osparc.jobs.RunsTableModel", {
     },
   },
 
+  statics: {
+    SERVER_MAX_LIMIT: 49,
+  },
+
   members: {
     // overridden
     _loadRowCount() {