🎨 [Frontend] Support center feedback

services/static-webserver/client/source/class/osparc/conversation/AddMessage.js

@@ -53,8 +53,9 @@ qx.Class.define("osparc.conversation.AddMessage", {
   },
 
   events: {
-    "messageAdded": "qx.event.type.Data",
-    "messageUpdated": "qx.event.type.Data",
+    "addMessage": "qx.event.type.Data",
+    "updateMessage": "qx.event.type.Data",
+    "notifyUser": "qx.event.type.Data",
   },
 
   members: {
@@ -171,70 +172,19 @@ qx.Class.define("osparc.conversation.AddMessage", {
     },
 
     addComment: function() {
-      const conversationId = this.getConversationId();
-      if (conversationId) {
-        return this.__postMessage();
-      } else {
-        const studyData = this.getStudyData();
-        let promise = null;
-        if (studyData) {
-          // create new project conversation first
-          promise = osparc.store.ConversationsProject.getInstance().postConversation(studyData["uuid"])
-        } else {
-          // support conversation
-          const extraContext = {};
-          const currentStudy = osparc.store.Store.getInstance().getCurrentStudy()
-          if (currentStudy) {
-            extraContext["projectId"] = currentStudy.getUuid();
-          }
-          promise = osparc.store.ConversationsSupport.getInstance().postConversation(extraContext);
-        }
-        return promise
-          .then(data => {
-            this.setConversationId(data["conversationId"]);
-            return this.__postMessage();
-          });
-      }
-    },
-
-    __postMessage: function() {
       const commentField = this.getChildControl("comment-field");
       const content = commentField.getChildControl("text-area").getValue();
-      let promise = null;
       if (content) {
-        const studyData = this.getStudyData();
-        const conversationId = this.getConversationId();
-        if (studyData) {
-          promise = osparc.store.ConversationsProject.getInstance().postMessage(studyData["uuid"], conversationId, content);
-        } else {
-          promise = osparc.store.ConversationsSupport.getInstance().postMessage(conversationId, content);
-        }
-        return promise
-          .then(data => {
-            this.fireDataEvent("messageAdded", data);
-            commentField.getChildControl("text-area").setValue("");
-            return data;
-          });
+        this.fireDataEvent("addMessage", content);
+        commentField.getChildControl("text-area").setValue("");
       }
-      return Promise.reject();
     },
 
     __editComment: function() {
       const commentField = this.getChildControl("comment-field");
       const content = commentField.getChildControl("text-area").getValue();
       if (content) {
-        const studyData = this.getStudyData();
-        const conversationId = this.getConversationId();
-        const message = this.getMessage();
-        if (studyData) {
-          promise = osparc.store.ConversationsProject.getInstance().editMessage(studyData["uuid"], conversationId, message["messageId"], content);
-        } else {
-          promise = osparc.store.ConversationsSupport.getInstance().editMessage(conversationId, message["messageId"], content);
-        }
-        promise.then(data => {
-          this.fireDataEvent("messageUpdated", data);
-          commentField.getChildControl("text-area").setValue("");
-        });
+        this.fireDataEvent("updateMessage", content);
       }
     },
 
@@ -273,7 +223,7 @@ qx.Class.define("osparc.conversation.AddMessage", {
       // This check only works if the project is directly shared with the user.
       // If it's shared through a group, it might be a bit confusing
       if (userGid in studyData["accessRights"]) {
-        this.__addNotify(userGid);
+        this.__doNotifyUser(userGid);
       } else {
         const msg = this.tr("This user has no access to the project. Do you want to share it?");
         const win = new osparc.ui.window.Confirmation(msg).set({
@@ -290,7 +240,7 @@ qx.Class.define("osparc.conversation.AddMessage", {
             };
             osparc.store.Study.getInstance().addCollaborators(studyData, newCollaborators)
               .then(() => {
-                this.__addNotify(userGid);
+                this.__doNotifyUser(userGid);
                 const potentialCollaborators = osparc.store.Groups.getInstance().getPotentialCollaborators()
                 if (userGid in potentialCollaborators && "getUserId" in potentialCollaborators[userGid]) {
                   const uid = potentialCollaborators[userGid].getUserId();
@@ -303,47 +253,13 @@ qx.Class.define("osparc.conversation.AddMessage", {
       }
     },
 
-    __addNotify: function(userGid) {
-      const studyData = this.getStudyData();
-      if (!studyData) {
-        return;
-      }
-
-      const conversationId = this.getConversationId();
-      if (conversationId) {
-        this.__postNotify(userGid);
-      } else {
-        // create new conversation first
-        osparc.store.ConversationsProject.getInstance().postConversation(studyData["uuid"])
-          .then(data => {
-            this.setConversationId(data["conversationId"]);
-            this.__postNotify(userGid);
-          });
-      }
-    },
-
-    __postNotify: function(userGid) {
+    __doNotifyUser: function(userGid) {
       const studyData = this.getStudyData();
       if (!studyData) {
         return;
       }
 
-      if (userGid) {
-        const conversationId = this.getConversationId();
-        osparc.store.ConversationsProject.getInstance().notifyUser(studyData["uuid"], conversationId, userGid)
-          .then(data => {
-            this.fireDataEvent("messageAdded", data);
-            const potentialCollaborators = osparc.store.Groups.getInstance().getPotentialCollaborators();
-            if (userGid in potentialCollaborators) {
-              if ("getUserId" in potentialCollaborators[userGid]) {
-                const uid = potentialCollaborators[userGid].getUserId();
-                osparc.notification.Notifications.pushConversationNotification(uid, studyData["uuid"]);
-              }
-              const msg = "getLabel" in potentialCollaborators[userGid] ? potentialCollaborators[userGid].getLabel() + this.tr(" was notified") : this.tr("Notification sent");
-              osparc.FlashMessenger.logAs(msg, "INFO");
-            }
-          });
-      }
+      this.fireDataEvent("notifyUser", userGid);
     },
     /* NOTIFY USERS */
   }

services/static-webserver/client/source/class/osparc/conversation/MessageUI.js

@@ -40,6 +40,9 @@ qx.Class.define("osparc.conversation.MessageUI", {
 
   statics: {
     isMyMessage: function(message) {
+      if (message["userGroupId"] === "system") {
+        return false;
+      }
       return message && osparc.auth.Data.getInstance().getGroupId() === message["userGroupId"];
     }
   },
@@ -163,15 +166,19 @@ qx.Class.define("osparc.conversation.MessageUI", {
       const messageContent = this.getChildControl("message-content");
       messageContent.setValue(message["content"]);
 
-      osparc.store.Users.getInstance().getUser(message["userGroupId"])
-        .then(user => {
-          thumbnail.setUser(user);
-          userName.setValue(user ? user.getLabel() : "Unknown user");
-        })
-        .catch(() => {
+      if (message["userGroupId"] === "system") {
+        userName.setValue("Support");
+      } else {
+        osparc.store.Users.getInstance().getUser(message["userGroupId"])
+          .then(user => {
+            thumbnail.setUser(user);
+            userName.setValue(user ? user.getLabel() : "Unknown user");
+          })
+          .catch(() => {
             thumbnail.setSource(osparc.utils.Avatar.emailToThumbnail());
             userName.setValue("Unknown user");
-        });
+          });
+      }
 
       this.getChildControl("spacer");
 
@@ -207,9 +214,19 @@ qx.Class.define("osparc.conversation.MessageUI", {
         resizable: true,
         showClose: true,
       });
-      addMessage.addListener("messageUpdated", e => {
-        win.close();
-        this.fireDataEvent("messageUpdated", e.getData());
+      addMessage.addListener("updateMessage", e => {
+        const content = e.getData();
+        const conversationId = message["conversationId"];
+        const messageId = message["messageId"];
+        if (this.__studyData) {
+          promise = osparc.store.ConversationsProject.getInstance().editMessage(this.__studyData["uuid"], conversationId, messageId, content);
+        } else {
+          promise = osparc.store.ConversationsSupport.getInstance().editMessage(conversationId, messageId, content);
+        }
+        promise.then(data => {
+          win.close();
+          this.fireDataEvent("messageUpdated", data);
+        });
       });
     },
 

services/static-webserver/client/source/class/osparc/data/model/NodeProgressSequence.js

@@ -231,6 +231,7 @@ qx.Class.define("osparc.data.model.NodeProgressSequence", {
     __initLayout: function() {
       this.__mainLoadingPage = new qx.ui.container.Composite(new qx.ui.layout.VBox(8)).set({
         maxWidth: 400,
+        decorator: "rounded",
       });
 
       const sequenceLoadingPage = new osparc.widget.ProgressSequence(qx.locale.Manager.tr("LOADING ..."));

services/static-webserver/client/source/class/osparc/navigation/NavigationBar.js

@@ -307,7 +307,7 @@ qx.Class.define("osparc.navigation.NavigationBar", {
           break;
         }
         case "help":
-          control = this.__createHelpMenuBtn().set({
+          control = this.__createHelpBtn().set({
             ...this.self().RIGHT_BUTTON_OPTS
           });
           osparc.utils.Utils.setIdToWidget(control, "helpNavigationBtn");
@@ -361,22 +361,12 @@ qx.Class.define("osparc.navigation.NavigationBar", {
       }, this);
     },
 
-    __createHelpMenuBtn: function() {
-      const menu = new qx.ui.menu.Menu().set({
-        position: "top-right",
-        appearance: "menu-wider",
-      });
-      const menuButton = new qx.ui.form.MenuButton(null, "@FontAwesome5Regular/question-circle/24", menu).set({
+    __createHelpBtn: function() {
+      const helpButton = new qx.ui.form.Button(null, "@FontAwesome5Regular/question-circle/24").set({
         backgroundColor: "transparent"
       });
-
-      osparc.utils.Utils.setIdToWidget(menu, "helpNavigationMenu");
-
-      // add support conversations
-      osparc.store.Support.addSupportConversationsToMenu(menu);
-
-
-      return menuButton;
+      helpButton.addListener("execute", () => osparc.support.SupportCenter.openWindow());
+      return helpButton;
     },
 
     __createLoginBtn: function() {

services/static-webserver/client/source/class/osparc/navigation/UserMenu.js

@@ -85,6 +85,14 @@ qx.Class.define("osparc.navigation.UserMenu", {
           control.addListener("execute", () => osparc.desktop.organizations.OrganizationsWindow.openWindow(), this);
           this.add(control);
           break;
+        case "help-button":
+          control = new qx.ui.menu.Button().set({
+            label: qx.locale.Manager.tr("Help & Support"),
+            icon: "@FontAwesome5Solid/question-circle/16",
+          });
+          control.addListener("execute", () => osparc.support.SupportCenter.openWindow());
+          this.add(control);
+          break;
         case "market":
           control = new qx.ui.menu.Button(this.tr("The Shop"));
           control.addListener("execute", () => osparc.vipMarket.MarketWindow.openWindow());
@@ -213,7 +221,7 @@ qx.Class.define("osparc.navigation.UserMenu", {
       this.addSeparator();
 
       // quick starts and manuals
-      osparc.store.Support.addSupportConversationsToMenu(this);
+      this.getChildControl("help-button");
       this.addSeparator();
 
       this.getChildControl("theme-switcher");

services/static-webserver/client/source/class/osparc/store/Support.js

@@ -19,33 +19,6 @@ qx.Class.define("osparc.store.Support", {
       return osparc.store.VendorInfo.getManuals();
     },
 
-    addSupportConversationsToMenu: function(menu) {
-      const supportCenterButton = new qx.ui.menu.Button().set({
-        label: qx.locale.Manager.tr("Help & Support"),
-        icon: "@FontAwesome5Solid/question-circle/16",
-      });
-      supportCenterButton.addListener("execute", () => osparc.support.SupportCenter.openWindow());
-      menu.add(supportCenterButton);
-
-      const askAQuestionButton = new qx.ui.menu.Button().set({
-        label: qx.locale.Manager.tr("Ask a Question"),
-        icon: "@FontAwesome5Solid/comments/16",
-        visibility: "excluded",
-      });
-      askAQuestionButton.addListener("execute", () => osparc.support.SupportCenter.openWindow("conversations"));
-      menu.add(askAQuestionButton);
-
-      const updateAskAQuestionButton = () => {
-        const isSupportEnabled = osparc.store.Groups.getInstance().isSupportEnabled();
-        askAQuestionButton.set({
-          visibility: isSupportEnabled ? "visible" : "excluded",
-        });
-      }
-
-      updateAskAQuestionButton();
-      osparc.store.Groups.getInstance().addListener("changeSupportGroup", () => updateAskAQuestionButton());
-    },
-
     __getQuickStartInfo: function() {
       const quickStart = osparc.product.quickStart.Utils.getQuickStart();
       if (quickStart) {