From 8bdc5c9fead3a0690a345468c611c89f27d4724a Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Tue, 21 Jan 2025 05:11:34 +0200
Subject: [PATCH] client: switch widget: prevent the check box to become out of
 sync with the switch toggle status

---
 src/public/app/widgets/switch.js | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/public/app/widgets/switch.js b/src/public/app/widgets/switch.js
index 00489b3d4..7f422b79c 100644
--- a/src/public/app/widgets/switch.js
+++ b/src/public/app/widgets/switch.js
@@ -46,6 +46,10 @@ const TPL = `
     .switch-widget .switch-button.on {
         background: green !important;
     }
+
+    .switch-widget input[type="checkbox"] {
+        pointer-events: none;
+    }
     </style>
 
     <div class="switch-widget">
@@ -75,7 +79,13 @@ export default class SwitchWidget extends NoteContextAwareWidget {
         this.$switchButton = this.$widget.find(".switch-button");
 
         this.$switchToggle = this.$widget.find(".switch-toggle");
-        this.$switchToggle.on("click", () => this.toggle(!this.currentState));
+        this.$switchToggle.on("click", (e) => {
+            this.toggle(!this.currentState);
+
+            // Prevent the check box from being toggled by the click, the value of the check box
+            // should be set exclusively by the 'isToggled' property setter.
+            e.preventDefault();
+        });
 
         this.$switchName = this.$widget.find(".switch-name");
 
@@ -103,6 +113,7 @@ export default class SwitchWidget extends NoteContextAwareWidget {
 
         this.$switchButton.toggleClass("on", this.currentState);
         this.$switchToggle.prop("checked", this.currentState);
+        console.log(this.currentState);
 
         if (this.currentState) {
             this.$switchName.text(this.switchOffName);