From 9d1e977e2a510bcbdb7cd852da78f1aac6e418c5 Mon Sep 17 00:00:00 2001
From: Aman Agrawal <amanagr@zulip.com>
Date: Fri, 12 Jan 2024 12:16:57 +0000
Subject: [PATCH] portico: Don't use `dropdown-toggle` class.

We want to avoid using `dropdown-toggle` class to avoid
properties leaking from bootstrap.
---
 templates/corporate/communities.html     | 2 +-
 templates/zerver/integrations/index.html | 2 +-
 web/src/portico/communities.ts           | 9 ++++++---
 web/src/portico/integrations.js          | 9 ++++++---
 web/styles/portico/integrations.css      | 2 +-
 5 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/templates/corporate/communities.html b/templates/corporate/communities.html
index 130ebde916..2885aebfa7 100644
--- a/templates/corporate/communities.html
+++ b/templates/corporate/communities.html
@@ -35,7 +35,7 @@
                 </div>
 
                 <div class="integration-categories-dropdown">
-                    <div class="dropdown-toggle">
+                    <div class="integration-toggle-categories-dropdown">
                         <h3 class="dropdown-category-label">{% trans %}Filter by category{% endtrans %}</h3>
                         <i class="fa fa-angle-down" aria-hidden="true"></i>
                     </div>
diff --git a/templates/zerver/integrations/index.html b/templates/zerver/integrations/index.html
index c9d32dc90e..834e9fff7d 100644
--- a/templates/zerver/integrations/index.html
+++ b/templates/zerver/integrations/index.html
@@ -43,7 +43,7 @@
                 </div>
 
                 <div class="integration-categories-dropdown">
-                    <div class="dropdown-toggle">
+                    <div class="integration-toggle-categories-dropdown">
                         <h3 class="dropdown-category-label">{% trans %}Filter by category{% endtrans %}</h3>
                         <i class="fa fa-angle-down" aria-hidden="true"></i>
                     </div>
diff --git a/web/src/portico/communities.ts b/web/src/portico/communities.ts
index 19b532ba2b..0685fd2e33 100644
--- a/web/src/portico/communities.ts
+++ b/web/src/portico/communities.ts
@@ -26,7 +26,10 @@ $(() => {
         sync_open_organizations_page_with_current_hash();
     });
 
-    $(".integration-categories-dropdown .dropdown-toggle").on("click", () => {
-        toggle_categories_dropdown();
-    });
+    $(".integration-categories-dropdown .integration-toggle-categories-dropdown").on(
+        "click",
+        () => {
+            toggle_categories_dropdown();
+        },
+    );
 });
diff --git a/web/src/portico/integrations.js b/web/src/portico/integrations.js
index 74fc1bf357..d1cb9388e2 100644
--- a/web/src/portico/integrations.js
+++ b/web/src/portico/integrations.js
@@ -315,9 +315,12 @@ function integration_events() {
         }
     });
 
-    $(".integration-categories-dropdown .dropdown-toggle").on("click", () => {
-        toggle_categories_dropdown();
-    });
+    $(".integration-categories-dropdown .integration-toggle-categories-dropdown").on(
+        "click",
+        () => {
+            toggle_categories_dropdown();
+        },
+    );
 
     $(".integration-instruction-block").on("click", "a .integration-category", (e) => {
         e.preventDefault();
diff --git a/web/styles/portico/integrations.css b/web/styles/portico/integrations.css
index da3602c691..273effe6b1 100644
--- a/web/styles/portico/integrations.css
+++ b/web/styles/portico/integrations.css
@@ -227,7 +227,7 @@ $category-text: hsl(219deg 23% 33%);
                 padding: 12px 20px;
             }
 
-            .dropdown-toggle {
+            .integration-toggle-categories-dropdown {
                 cursor: pointer;
                 display: flex;
                 position: relative;