🐛 Fix: Frontend generated logs in App Mode (ITISFoundation#4888)

services/static-webserver/client/source/class/osparc/auth/ui/RegistrationView.js

@@ -94,7 +94,7 @@ qx.Class.define("osparc.auth.ui.RegistrationView", {
       // buttons
       const grp = new qx.ui.container.Composite(new qx.ui.layout.HBox(5));
 
-      const submitBtn = this.__submitBtn = new qx.ui.form.Button(this.tr("Submit")).set({
+      const submitBtn = this.__submitBtn = new osparc.ui.form.FetchButton(this.tr("Submit")).set({
         center: true,
         appearance: "strong-button"
       });
@@ -118,7 +118,7 @@ qx.Class.define("osparc.auth.ui.RegistrationView", {
               password: password1.getValue(),
               confirm: password2.getValue(),
               invitation: invitationToken ? invitationToken : ""
-            });
+            }, submitBtn);
           }
         }
       }, this);
@@ -128,7 +128,8 @@ qx.Class.define("osparc.auth.ui.RegistrationView", {
       this.add(grp);
     },
 
-    __submit: function(userData) {
+    __submit: function(userData, submitButton) {
+      submitButton.setFetching(true);
       osparc.auth.Manager.getInstance().register(userData)
         .then(log => {
           this.fireDataEvent("done", log.message);
@@ -137,7 +138,8 @@ qx.Class.define("osparc.auth.ui.RegistrationView", {
         .catch(err => {
           const msg = err.message || this.tr("Cannot register user");
           osparc.FlashMessenger.getInstance().logAs(msg, "ERROR");
-        });
+        })
+        .finally(() => submitButton.setFetching(false));
     },
 
     _onAppear: function() {

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

@@ -693,6 +693,15 @@ qx.Class.define("osparc.data.Resources", {
           }
         }
       },
+      "productMetadata": {
+        useCache: true,
+        endpoints: {
+          get: {
+            method: "GET",
+            url: statics.API + "/products/{productName}"
+          }
+        }
+      },
       "invitations": {
         endpoints: {
           post: {

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

@@ -607,20 +607,7 @@ qx.Class.define("osparc.desktop.WorkbenchView", {
         const nodeId = data.nodeId;
         const msg = data.msg;
         const logLevel = ("level" in data) ? data["level"] : "INFO";
-        switch (logLevel) {
-          case "DEBUG":
-            this.__loggerView.debug(nodeId, msg);
-            break;
-          case "WARNING":
-            this.__loggerView.warn(nodeId, msg);
-            break;
-          case "ERROR":
-            this.__loggerView.error(nodeId, msg);
-            break;
-          default:
-            this.__loggerView.info(nodeId, msg);
-            break;
-        }
+        this.__logsToLogger(nodeId, [msg], logLevel);
       }, this);
 
       workbench.addListener("fileRequested", () => {
@@ -633,6 +620,29 @@ qx.Class.define("osparc.desktop.WorkbenchView", {
       this.__workbenchUIConnected = true;
     },
 
+    __logsToLogger: function(nodeId, logs, logLevel) {
+      // the node logger is mainly used in App Mode
+      const nodeLogger = this.__getNodeLogger(nodeId);
+      switch (logLevel) {
+        case "DEBUG":
+          this.__loggerView.debugs(nodeId, logs);
+          nodeLogger.debugs(nodeId, logs);
+          break;
+        case "WARNING":
+          this.__loggerView.warns(nodeId, logs);
+          nodeLogger.warns(nodeId, logs);
+          break;
+        case "ERROR":
+          this.__loggerView.errors(nodeId, logs);
+          nodeLogger.errors(nodeId, logs);
+          break;
+        default:
+          this.__loggerView.infos(nodeId, logs);
+          nodeLogger.infos(nodeId, logs);
+          break;
+      }
+    },
+
     __attachSocketEventHandlers: function() {
       // Listen to socket
       const socket = osparc.wrapper.WebSocket.getInstance();
@@ -650,24 +660,7 @@ qx.Class.define("osparc.desktop.WorkbenchView", {
           const messages = data["messages"];
           const logLevelMap = osparc.widget.logger.LoggerView.LOG_LEVEL_MAP;
           const logLevel = ("log_level" in data) ? logLevelMap[data["log_level"]] : "INFO";
-          switch (logLevel) {
-            case "DEBUG":
-              this.__loggerView.debugs(nodeId, messages);
-              break;
-            case "WARNING":
-              this.__loggerView.warns(nodeId, messages);
-              break;
-            case "ERROR":
-              this.__loggerView.errors(nodeId, messages);
-              break;
-            default:
-              this.__loggerView.infos(nodeId, messages);
-              break;
-          }
-          const nodeLogger = this.__getNodeLogger(nodeId);
-          if (nodeLogger) {
-            nodeLogger.infos(nodeId, messages);
-          }
+          this.__logsToLogger(nodeId, messages, logLevel);
         }, this);
       }
       socket.emit(slotName);

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

@@ -175,7 +175,8 @@ qx.Class.define("osparc.desktop.credits.Usage", {
         params.url["walletId"] = walletId.toString();
         return osparc.data.Resources.fetch("resourceUsagePerWallet", "getPage", params, undefined, options);
       }
-      return null;
+      // Usage supports the non wallet enabled products
+      return osparc.data.Resources.fetch("resourceUsage", "getPage", params, undefined, options);
     },
 
     __setData: function(data) {

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

@@ -59,7 +59,7 @@ qx.Class.define("osparc.desktop.credits.UserCenter", {
       tabViews.add(buyCreditsPage);
     }
 
-    if (osparc.data.Permissions.getInstance().canDo("usage.all.read")) {
+    if (this.__walletsEnabled) {
       const activityPage = this.__activityPage = this.__getActivityPage();
       tabViews.add(activityPage);
     }

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

@@ -100,10 +100,7 @@ qx.Class.define("osparc.navigation.UserMenuButton", {
           break;
         case "po-center":
           control = new qx.ui.menu.Button(this.tr("PO Center"));
-          control.addListener("execute", () => {
-            const poCenterWindow = osparc.po.POCenterWindow.openWindow();
-            poCenterWindow.openInvitations();
-          }, this);
+          control.addListener("execute", () => osparc.po.POCenterWindow.openWindow(), this);
           this.getMenu().add(control);
           break;
         case "preferences":

services/static-webserver/client/source/class/osparc/node/UpdateResourceLimitsView.js

@@ -100,7 +100,7 @@ qx.Class.define("osparc.node.UpdateResourceLimitsView", {
                     if (resourceKey === "RAM") {
                       value = osparc.utils.Utils.bytesToGB(value);
                     }
-                    const spinner = new qx.ui.form.Spinner(0, value, 200).set({
+                    const spinner = new qx.ui.form.Spinner(0, value, 512).set({
                       singleStep: 0.1
                     });
                     const nf = new qx.util.format.NumberFormat();

services/static-webserver/client/source/class/osparc/po/POCenter.js

@@ -27,45 +27,46 @@ qx.Class.define("osparc.po.POCenter", {
       padding: 10
     });
 
-    const tabViews = this.__tabsView = new qx.ui.tabview.TabView().set({
+    const tabViews = new qx.ui.tabview.TabView().set({
       barPosition: "left",
       contentPadding: 0
     });
     tabViews.getChildControl("bar").add(osparc.desktop.credits.UserCenter.createMiniProfileView());
 
-    const invitationsPage = this.__invitationsPage = this.__getInvitationsPage();
+    const invitationsPage = this.__getInvitationsPage();
     tabViews.add(invitationsPage);
 
+    const productPage = this.__getProductPage();
+    tabViews.add(productPage);
+
     this._add(tabViews);
   },
 
   members: {
-    __tabsView: null,
-    __invitationsPage: null,
-
     __getInvitationsPage: function() {
       const title = this.tr("Invitations");
       const iconSrc = "@FontAwesome5Solid/envelope/22";
       const page = new osparc.desktop.preferences.pages.BasePage(title, iconSrc);
       page.showLabelOnTab();
-      const overview = new osparc.po.Invitations();
-      overview.set({
+      const invitations = new osparc.po.Invitations();
+      invitations.set({
         margin: 10
       });
-      page.add(overview);
+      page.add(invitations);
       return page;
     },
 
-    __openPage: function(page) {
-      if (page) {
-        this.__tabsView.setSelection([page]);
-      }
-    },
-
-    openInvitations: function() {
-      if (this.__invitationsPage) {
-        this.__openPage(this.__invitationsPage);
-      }
+    __getProductPage: function() {
+      const title = this.tr("Product Info");
+      const iconSrc = "@FontAwesome5Solid/info/22";
+      const page = new osparc.desktop.preferences.pages.BasePage(title, iconSrc);
+      page.showLabelOnTab();
+      const productInfo = new osparc.po.ProductInfo();
+      productInfo.set({
+        margin: 10
+      });
+      page.add(productInfo);
+      return page;
     }
   }
 });

services/static-webserver/client/source/class/osparc/po/POCenterWindow.js

@@ -35,7 +35,7 @@ qx.Class.define("osparc.po.POCenterWindow", {
       appearance: "service-window"
     });
 
-    const poCenter = this.__poCenter = new osparc.po.POCenter();
+    const poCenter = new osparc.po.POCenter();
     this.add(poCenter);
   },
 
@@ -46,13 +46,5 @@ qx.Class.define("osparc.po.POCenterWindow", {
       accountWindow.open();
       return accountWindow;
     }
-  },
-
-  members: {
-    __poCenter: null,
-
-    openInvitations: function() {
-      this.__poCenter.openInvitations();
-    }
   }
 });

services/static-webserver/client/source/class/osparc/po/ProductInfo.js

@@ -0,0 +1,49 @@
+/* ************************************************************************
+
+   osparc - the simcore frontend
+
+   https://osparc.io
+
+   Copyright:
+     2023 IT'IS Foundation, https://itis.swiss
+
+   License:
+     MIT: https://opensource.org/licenses/MIT
+
+   Authors:
+     * Odei Maiz (odeimaiz)
+
+************************************************************************ */
+
+qx.Class.define("osparc.po.ProductInfo", {
+  extend: qx.ui.core.Widget,
+
+  construct: function() {
+    this.base(arguments);
+
+    this._setLayout(new qx.ui.layout.VBox(10));
+
+    this.__fetchInfo();
+  },
+
+  members: {
+    __fetchInfo: function() {
+      const params = {
+        url: {
+          productName: osparc.product.Utils.getProductName()
+        }
+      };
+      osparc.data.Resources.fetch("productMetadata", "get", params)
+        .then(respData => {
+          const invitationRespViewer = new osparc.ui.basic.JsonTreeWidget(respData, "product-metadata");
+          const container = new qx.ui.container.Scroll().set({
+            maxHeight: 500
+          });
+          container.add(invitationRespViewer);
+          this._add(container, {
+            flex: 1
+          });
+        });
+    }
+  }
+});

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

@@ -129,6 +129,11 @@ qx.Class.define("osparc.store.Store", {
       nullable: true,
       event: "changeCreditPrice"
     },
+    productMetadata: {
+      check: "Object",
+      init: {},
+      nullable: true
+    },
     permissions: {
       check: "Array",
       init: []

services/static-webserver/client/source/class/osparc/ui/basic/JsonTreeWidget.js

@@ -39,7 +39,8 @@ qx.Class.define("osparc.ui.basic.JsonTreeWidget", {
     const prettyJson = JSON.stringify(data, null, "&emsp;").replace(/\n/ig, "<br>");
     this.base(arguments, prettyJson);
     this.set({
-      rich: true
+      rich: true,
+      selectable: true
     });
   }
 });