From d4ef84e0b72f4e8b7f96bc989305af81596d0ae0 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Wed, 22 Jan 2025 01:24:09 +0200
Subject: [PATCH] client: switch widget: handle the disabled state

---
 src/public/app/widgets/shared_switch.js |  8 ++++----
 src/public/app/widgets/switch.js        | 27 +++++++++++++++++++++----
 2 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/src/public/app/widgets/shared_switch.js b/src/public/app/widgets/shared_switch.js
index e739ecf32..90d2e7e9e 100644
--- a/src/public/app/widgets/shared_switch.js
+++ b/src/public/app/widgets/shared_switch.js
@@ -56,11 +56,11 @@ export default class SharedSwitchWidget extends SwitchWidget {
         this.isToggled = isShared;
 
         if (switchDisabled) {
-            //this.$widget.attr("title", t("shared_switch.inherited"));
-            //this.$switchOff.addClass("switch-disabled");
+            this.disabledTooltip = t("shared_switch.inherited");
+            this.canToggle = false;
         } else {
-            //this.$widget.removeAttr("title");
-            //this.$switchOff.removeClass("switch-disabled");
+            this.disabledTooltip = "";
+            this.canToggle = true;
         }
     }
 
diff --git a/src/public/app/widgets/switch.js b/src/public/app/widgets/switch.js
index e9983d5e3..45a0a0307 100644
--- a/src/public/app/widgets/switch.js
+++ b/src/public/app/widgets/switch.js
@@ -28,7 +28,6 @@ const TPL = `
         border-radius: 24px;
         background-color: var(--switch-off-track-background);
         transition: background 200ms ease-in;
-        cursor: pointer;
     }
 
     .switch-widget .switch-button.on {
@@ -61,13 +60,17 @@ const TPL = `
                     background 100ms ease-in;
     }
 
-    .switch-widget .switch-button > input[type="checkbox"] {
+    .switch-widget .switch-button input[type="checkbox"] {
         position: absolute:
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         opacity: 0;
+    }
+
+    .switch-widget .switch-button:not(.disabled) input[type="checkbox"],
+    .switch-widget .switch-button:not(.disabled) {
         cursor: pointer;
     }
 
@@ -76,9 +79,8 @@ const TPL = `
         outline-offset: 2px;
     }
 
-    .switch-widget .switch-disabled {
+    .switch-widget .switch-button.disabled {
         opacity: 70%;
-        pointer-events: none;
     }
 
     .switch-widget .switch-help-button {
@@ -117,6 +119,8 @@ export default class SwitchWidget extends NoteContextAwareWidget {
     switchOffName;
     switchOffTooltip;
 
+    disabledTooltip;
+
     currentState = false;
 
     doRender() {
@@ -167,4 +171,19 @@ export default class SwitchWidget extends NoteContextAwareWidget {
             this.$switchButton.attr("title", this.switchOnTooltip);
         }
     }
+
+    get canToggle() {
+        return (!this.$switchButton.hasClass("disabled"));
+    }
+
+    set canToggle(isEnabled) {
+        this.$switchButton.toggleClass("disabled", !isEnabled);
+        this.$switchToggle.attr("disabled", !isEnabled);
+
+        if (isEnabled) {
+            this.isToggled = this.currentState; // Reapply the correct tooltip
+        } else {
+            this.$switchButton.attr("title", this.disabledTooltip);
+        }
+    }
 }