Safer

Author: odeimaiz

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

@@ -188,9 +188,10 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {
           break;
         }
         case "title":
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             textColor: "contrasted-text-light",
             font: "text-14",
+            rich: false, // do not allow multi-line titles
           });
           layout = this.getChildControl("header");
           layout.add(control, this.self().HPOS.TITLE);
@@ -205,12 +206,11 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {
           break;
         }
         case "subtitle-text": {
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             textColor: "contrasted-text-dark",
             alignY: "middle",
             allowGrowX: true,
             allowShrinkX: true,
-            rich: true,
             anonymous: true,
             font: "text-12",
             allowGrowY: false

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

@@ -62,11 +62,10 @@ qx.Class.define("osparc.dashboard.GridButtonTaskPlaceholder", {
       let layout;
       switch (id) {
         case "state-label": {
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             textColor: "contrasted-text-dark",
             allowGrowX: true,
             allowShrinkX: true,
-            rich: true,
             anonymous: true,
             font: "text-12",
             allowGrowY: true,

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

@@ -101,10 +101,18 @@ qx.Class.define("osparc.dashboard.GroupedCardContainer", {
             allowGrowX: false
           });
           control.getChildControl("icon").set(osparc.utils.Utils.getThumbnailProps(32));
-          control.getChildControl("label").set({
+          const atomLabel = control.getChildControl("label");
+          atomLabel.set({
             rich: true,
             wrap: true
-          })
+          });
+          atomLabel.addListener("changeValue", e => {
+            const val = e.getData();
+            const sanitized = osparc.wrapper.DOMPurify.sanitize(val);
+            if (sanitized !== val) {
+              atomLabel.setValue(sanitized);
+            }
+          });
           control.getContentElement().setStyles({
             "border-top-left-radius": "4px",
             "border-top-right-radius": "4px"

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

@@ -75,12 +75,11 @@ qx.Class.define("osparc.dashboard.ListButtonBase", {
           break;
         }
         case "title":
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             textColor: "contrasted-text-light",
             font: "text-14",
             alignY: "middle",
             maxWidth: 300,
-            rich: true,
           });
           this._add(control, {
             row: 0,

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

@@ -93,12 +93,11 @@ qx.Class.define("osparc.desktop.credits.CreditsServiceListItem", {
           break;
         }
         case "title":
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             font: "text-12",
             alignY: "middle",
             maxWidth: 200,
             allowGrowX: true,
-            rich: true,
           });
           this._add(control, this.self().GRID.NAME);
           break;

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

@@ -47,7 +47,6 @@ qx.Class.define("osparc.desktop.organizations.ServicesList", {
       const intro = new qx.ui.basic.Label().set({
         value: msg,
         alignX: "left",
-        rich: true,
         font: "text-13"
       });
       return intro;

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

@@ -47,7 +47,6 @@ qx.Class.define("osparc.desktop.organizations.TutorialsList", {
       const intro = new qx.ui.basic.Label().set({
         value: msg,
         alignX: "left",
-        rich: true,
         font: "text-13"
       });
       return intro;

services/static-webserver/client/source/class/osparc/desktop/preferences/window/APIKeyBase.js

@@ -37,10 +37,9 @@ qx.Class.define("osparc.desktop.preferences.window.APIKeyBase", {
 
   members: {
     __addInfoText: function(infoText) {
-      const introLabel = new qx.ui.basic.Label(infoText).set({
+      const introLabel = new osparc.ui.basic.SafeLabel(infoText).set({
         paddingLeft: 5,
         paddingRight: 5,
-        rich: true
       });
       this.add(introLabel);
     }

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

@@ -95,9 +95,8 @@ qx.Class.define("osparc.desktop.wallets.WalletListItem", {
           });
           break;
         case "subtitle":
-          control = new qx.ui.basic.Label().set({
+          control = new osparc.ui.basic.SafeLabel().set({
             font: "text-13",
-            rich: true
           });
           this._add(control, {
             row: 1,

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

@@ -215,10 +215,9 @@ qx.Class.define("osparc.desktop.wallets.WalletsList", {
 
     __createHeader: function(label, showCurrently) {
       const header = new qx.ui.container.Composite(new qx.ui.layout.HBox());
-      const userWallets = new qx.ui.basic.Label().set({
+      const userWallets = new osparc.ui.basic.SafeLabel().set({
         value: label,
         alignX: "left",
-        rich: true,
         font: "text-14"
       });
       header.add(userWallets);