username

Author: odeimaiz

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

@@ -53,6 +53,13 @@ qx.Class.define("osparc.auth.Data", {
       apply: "__applyAuth"
     },
 
+    username: {
+      check: "String",
+      init: null,
+      nullable: false,
+      event: "changeUsername",
+    },
+
     /**
      *  Email of logged in user, otherwise null
     */
@@ -135,18 +142,6 @@ qx.Class.define("osparc.auth.Data", {
       return osparc.utils.Utils.cookie.getCookie("user") === "logout";
     },
 
-    getUserName: function() {
-      const firstName = this.getFirstName();
-      if (firstName) {
-        return firstName;
-      }
-      const email = this.getEmail();
-      if (email) {
-        return osparc.utils.Utils.getNameFromEmail(email);
-      }
-      return "user";
-    },
-
     getFriendlyRole: function() {
       const role = this.getRole();
       let friendlyRole = role.replace(/_/g, " ");

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

@@ -240,6 +240,7 @@ qx.Class.define("osparc.auth.Manager", {
       const authData = osparc.auth.Data.getInstance();
       authData.set({
         email: profile["login"],
+        username: profile["userName"],
         firstName: profile["first_name"] || profile["login"],
         lastName: profile["last_name"] || "",
         expirationDate: "expirationDate" in profile ? new Date(profile["expirationDate"]) : null

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

@@ -68,6 +68,13 @@ qx.Class.define("osparc.desktop.account.MyAccount", {
         converter: lastName => authData.getFirstName() + " " + lastName
       });
 
+      const usernameLabel = new qx.ui.basic.Label().set({
+        font: "text-14",
+        alignX: "center"
+      });
+      authData.bind("username", usernameLabel, "value");
+      layout.add(usernameLabel);
+
       if (authData.getRole() !== "user") {
         const role = authData.getFriendlyRole();
         const roleLabel = new qx.ui.basic.Label(role).set({
@@ -77,12 +84,6 @@ qx.Class.define("osparc.desktop.account.MyAccount", {
         layout.add(roleLabel);
       }
 
-      const emailLabel = new qx.ui.basic.Label(email).set({
-        font: "text-13",
-        alignX: "center"
-      });
-      layout.add(emailLabel);
-
       if (withSpacer) {
         layout.add(new qx.ui.core.Spacer(15, 15));
       }

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

@@ -31,9 +31,6 @@ qx.Class.define("osparc.desktop.account.ProfilePage", {
 
     this._setLayout(new qx.ui.layout.VBox(15));
 
-    this.__userProfileData = null;
-    this.__userProfileModel = null;
-
     this.__fetchProfile();
 
     this._add(this.__createProfileUser());
@@ -64,6 +61,7 @@ qx.Class.define("osparc.desktop.account.ProfilePage", {
         this.__userProfileModel.set({
           "firstName": data["first_name"] || "",
           "lastName": data["last_name"] || "",
+          "username": data["userName"] || "",
           "email": data["login"],
           "expirationDate": data["expirationDate"] || null
         });
@@ -86,6 +84,10 @@ qx.Class.define("osparc.desktop.account.ProfilePage", {
         placeholder: this.tr("Last Name")
       });
 
+      const username = new qx.ui.form.TextField().set({
+        placeholder: this.tr("username")
+      });
+
       const email = new qx.ui.form.TextField().set({
         placeholder: this.tr("Email"),
         readOnly: true
@@ -94,6 +96,7 @@ qx.Class.define("osparc.desktop.account.ProfilePage", {
       const form = new qx.ui.form.Form();
       form.add(firstName, "First Name", null, "firstName");
       form.add(lastName, "Last Name", null, "lastName");
+      form.add(username, "Username", null, "username");
       form.add(email, "Email", null, "email");
       box.add(new qx.ui.form.renderer.Single(form));
 
@@ -118,6 +121,7 @@ qx.Class.define("osparc.desktop.account.ProfilePage", {
       const raw = {
         "firstName": "",
         "lastName": "",
+        "username": "",
         "email": "",
         "expirationDate": null
       };
@@ -132,6 +136,7 @@ qx.Class.define("osparc.desktop.account.ProfilePage", {
         }
       });
       controller.addTarget(lastName, "value", "lastName", true);
+      controller.addTarget(username, "value", "username", true);
       controller.addTarget(expirationDate, "value", "expirationDate", false, {
         converter: expirationDay => {
           if (expirationDay) {
@@ -163,12 +168,17 @@ qx.Class.define("osparc.desktop.account.ProfilePage", {
           return;
         }
 
-        if (this.__userProfileData["first_name"] !== model.getFirstName() || this.__userProfileData["last_name"] !== model.getLastName()) {
+        if (
+          this.__userProfileData["first_name"] !== model.getFirstName() ||
+          this.__userProfileData["last_name"] !== model.getLastName() ||
+          this.__userProfileData["username"] !== model.getUsername()
+        ) {
           if (namesValidator.validate()) {
             const params = {
               data: {
                 "first_name": model.getFirstName(),
                 "last_name": model.getLastName(),
+                "userName": model.getUsername(),
               }
             };
             osparc.data.Resources.fetch("profile", "patch", params)

services/static-webserver/client/source/class/osparc/product/quickStart/s4l/Welcome.js

@@ -55,7 +55,7 @@ qx.Class.define("osparc.product.quickStart.s4l.Welcome", {
       });
       content.add(intro1);
 
-      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUserName()) + ",";
+      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUsername()) + ",";
       const welcome = osparc.product.quickStart.Utils.createLabel(welcomeText);
       content.add(welcome);
 

services/static-webserver/client/source/class/osparc/product/quickStart/s4lacad/Welcome.js

@@ -55,7 +55,7 @@ qx.Class.define("osparc.product.quickStart.s4lacad.Welcome", {
       });
       content.add(intro1);
 
-      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUserName()) + ",";
+      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUsername()) + ",";
       const welcome = osparc.product.quickStart.Utils.createLabel(welcomeText);
       content.add(welcome);
 

services/static-webserver/client/source/class/osparc/product/quickStart/s4llite/Welcome.js

@@ -25,7 +25,7 @@ qx.Class.define("osparc.product.quickStart.s4llite.Welcome", {
 
   members: {
     _populateCard: function() {
-      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUserName()) + ",";
+      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUsername()) + ",";
       const welcome = osparc.product.quickStart.Utils.createLabel(welcomeText);
       this._add(welcome);
 

services/static-webserver/client/source/class/osparc/product/quickStart/tis/Welcome.js

@@ -25,7 +25,7 @@ qx.Class.define("osparc.product.quickStart.tis.Welcome", {
 
   members: {
     _populateCard: function() {
-      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUserName()) + ",";
+      const welcomeText = this.tr("Welcome onboard ") + osparc.utils.Utils.capitalize(osparc.auth.Data.getInstance().getUsername()) + ",";
       const welcome = osparc.product.quickStart.Utils.createLabel(welcomeText);
       this._add(welcome);