From ba73f1efc91c8342742bf9fd943f6fffeec15f1b Mon Sep 17 00:00:00 2001
From: usmannasir <usman@cyberpersons.com>
Date: Mon, 24 Nov 2025 02:07:19 +0500
Subject: [PATCH] Fix OWASP toggle interaction and prevent recursive change
 events

Fixes issues where toggle became unresponsive and triggered recursive calls:

1. Add flags (updatingOWASPStatus, updatingComodoStatus) to prevent change
   event handlers from triggering when status check updates toggle state
2. Guard change event handlers to return early when flags are set
3. Set flags before updating toggle via prop('checked'), reset after 100ms
4. Use timeout delays (500ms) before status checks after install/uninstall
   to allow operations to complete and prevent race conditions

This ensures:
- Toggle responds correctly to user clicks
- Status updates don't trigger unwanted installations
- No recursive loops when updating toggle state
- Clean separation between user actions and status updates
---
 firewall/static/firewall/firewall.js | 33 +++++++++++++++++++++++++---
 1 file changed, 30 insertions(+), 3 deletions(-)

diff --git a/firewall/static/firewall/firewall.js b/firewall/static/firewall/firewall.js
index 2b4043b64..71750d5f5 100644
--- a/firewall/static/firewall/firewall.js
+++ b/firewall/static/firewall/firewall.js
@@ -1226,10 +1226,17 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
     var comodoInstalled = false;
     var counterOWASP = 0;
     var counterComodo = 0;
+    var updatingOWASPStatus = false;
+    var updatingComodoStatus = false;
 
 
     $('#owaspInstalled').change(function () {
 
+        // Prevent triggering installation when status check updates the toggle
+        if (updatingOWASPStatus) {
+            return;
+        }
+
         owaspInstalled = $(this).prop('checked');
         $scope.ruleFiles = true;
 
@@ -1246,6 +1253,11 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
 
     $('#comodoInstalled').change(function () {
 
+        // Prevent triggering installation when status check updates the toggle
+        if (updatingComodoStatus) {
+            return;
+        }
+
         $scope.ruleFiles = true;
         comodoInstalled = $(this).prop('checked');
 
@@ -1291,6 +1303,10 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
 
                 if (updateToggle === true) {
 
+                    // Set flags to prevent change event from triggering installation
+                    updatingOWASPStatus = true;
+                    updatingComodoStatus = true;
+
                     if (response.data.owaspInstalled === 1) {
                         $('#owaspInstalled').prop('checked', true);
                         $scope.owaspDisable = false;
@@ -1305,6 +1321,13 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
                         $('#comodoInstalled').prop('checked', false);
                         $scope.comodoDisable = true;
                     }
+
+                    // Reset flags after toggle update
+                    $timeout(function() {
+                        updatingOWASPStatus = false;
+                        updatingComodoStatus = false;
+                    }, 100);
+
                 } else {
 
                     if (response.data.owaspInstalled === 1) {
@@ -1366,8 +1389,10 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
                 $scope.installationFailed = true;
                 $scope.installationSuccess = false;
 
-                // Update toggle state immediately to reflect installation result
-                getOWASPAndComodoStatus(true);
+                // Update toggle state after a short delay to reflect installation result
+                $timeout(function() {
+                    getOWASPAndComodoStatus(true);
+                }, 500);
 
             } else {
                 $scope.modsecLoading = true;
@@ -1382,7 +1407,9 @@ app.controller('modSecRulesPack', function ($scope, $http, $timeout, $window) {
                 $scope.errorMessage = response.data.error_message;
 
                 // Update toggle to reflect failed installation (will show OFF)
-                getOWASPAndComodoStatus(true);
+                $timeout(function() {
+                    getOWASPAndComodoStatus(true);
+                }, 500);
             }
 
         }