From 4c0e3c53a4fac905148da74cabb9d70946b02470 Mon Sep 17 00:00:00 2001
From: odeimaiz <maiz@itis.swiss>
Date: Mon, 9 Dec 2024 17:49:14 +0100
Subject: [PATCH] Select button

---
 .../class/osparc/study/PricingUnitTier.js     | 31 +++++++++++++++++++
 .../source/class/osparc/study/PricingUnits.js | 23 +++++++++-----
 2 files changed, 46 insertions(+), 8 deletions(-)

diff --git a/services/static-webserver/client/source/class/osparc/study/PricingUnitTier.js b/services/static-webserver/client/source/class/osparc/study/PricingUnitTier.js
index 53bee23f010..85d51c1a88d 100644
--- a/services/static-webserver/client/source/class/osparc/study/PricingUnitTier.js
+++ b/services/static-webserver/client/source/class/osparc/study/PricingUnitTier.js
@@ -19,6 +19,7 @@ qx.Class.define("osparc.study.PricingUnitTier", {
   extend: osparc.study.PricingUnit,
 
   events: {
+    "selectPricingUnit": "qx.event.type.Event",
   },
 
   properties: {
@@ -35,6 +36,13 @@ qx.Class.define("osparc.study.PricingUnitTier", {
       nullable: true,
       event: "changeShowUnitExtraInfo"
     },
+
+    showSelectButton: {
+      check: "Boolean",
+      init: false,
+      nullable: true,
+      event: "changeShowSelectButton"
+    },
   },
 
   members: {
@@ -60,6 +68,26 @@ qx.Class.define("osparc.study.PricingUnitTier", {
           });
           this._add(control);
           break;
+        case "select-button":
+          control = new qx.ui.form.Button().set({
+            appearance: "strong-button",
+            center: true,
+          });
+          this.bind("value", control, "label", {
+            converter: value => value ? "Selected" : "Select"
+          });
+          this.bind("value", control, "enabled", {
+            converter: value => !value
+          });
+          this.bind("showSelectButton", control, "visibility", {
+            converter: show => show ? "visible" : "excluded"
+          });
+          control.addListener("execute", () => {
+            this.setValue(true);
+            this.fireEvent("selectPricingUnit");
+          });
+          this._add(control);
+          break;
       }
       return control || this.base(arguments, id);
     },
@@ -90,6 +118,9 @@ qx.Class.define("osparc.study.PricingUnitTier", {
       });
       unitExtraInfo.setValue(text);
 
+      // add select button
+      this.getChildControl("select-button");
+
       // add edit button
       this.getChildControl("edit-button");
     }
diff --git a/services/static-webserver/client/source/class/osparc/study/PricingUnits.js b/services/static-webserver/client/source/class/osparc/study/PricingUnits.js
index 9cc451a30e3..5f626f7cce8 100644
--- a/services/static-webserver/client/source/class/osparc/study/PricingUnits.js
+++ b/services/static-webserver/client/source/class/osparc/study/PricingUnits.js
@@ -43,7 +43,9 @@ qx.Class.define("osparc.study.PricingUnits", {
       const buttons = [];
       pricingUnitsData.forEach(pricingUnitData => {
         const pricingUnit = new osparc.data.model.PricingUnit(pricingUnitData);
-        const button = new osparc.study.PricingUnitTier(pricingUnit);
+        const button = new osparc.study.PricingUnitTier(pricingUnit).set({
+          showSelectButton: changeSelectionAllowed,
+        });
         buttons.push(button);
         this._add(button);
       });
@@ -74,13 +76,18 @@ qx.Class.define("osparc.study.PricingUnits", {
         if (!changeSelectionAllowed) {
           button.setCursor("default");
         }
-        button.addListener("execute", () => {
-          if (changeSelectionAllowed) {
-            const selectedUnitId = button.getUnitData().getPricingUnitId();
-            this.setSelectedUnitId(selectedUnitId);
-          } else {
-            buttons.forEach(btn => btn.setValue(btn.getUnitData().getIsDefault()));
-          }
+        [
+          "execute",
+          "selectPricingUnit",
+        ].forEach(ev => {
+          button.addListener(ev, () => {
+            if (changeSelectionAllowed) {
+              const selectedUnitId = button.getUnitData().getPricingUnitId();
+              this.setSelectedUnitId(selectedUnitId);
+            } else {
+              buttons.forEach(btn => btn.setValue(btn.getUnitData().getIsDefault()));
+            }
+          });
         });
       });
     }