From 99a375e354496961fa5c94c132e4bda44e8af531 Mon Sep 17 00:00:00 2001
From: Neeraj Vageele <neerajvageele451@gmail.com>
Date: Tue, 11 Apr 2023 10:43:52 +0530
Subject: [PATCH] bind html with switch for manage extension setting (#10553)

option

Co-authored-by: Neeraj <neerajv@thirdrocktechkno.com>
---
 src/components/views/elements/ToggleSwitch.tsx          | 3 +++
 src/components/views/settings/SetIntegrationManager.tsx | 5 +++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/views/elements/ToggleSwitch.tsx b/src/components/views/elements/ToggleSwitch.tsx
index c5917c2052..f29405ba8d 100644
--- a/src/components/views/elements/ToggleSwitch.tsx
+++ b/src/components/views/elements/ToggleSwitch.tsx
@@ -35,6 +35,9 @@ interface IProps {
 
     // Called when the checked state changes. First argument will be the new state.
     onChange(checked: boolean): void;
+
+    // id to bind with other elements
+    id?: string;
 }
 
 // Controlled Toggle Switch element, written with Accessibility in mind
diff --git a/src/components/views/settings/SetIntegrationManager.tsx b/src/components/views/settings/SetIntegrationManager.tsx
index 0290c4b7fe..c2a498d53d 100644
--- a/src/components/views/settings/SetIntegrationManager.tsx
+++ b/src/components/views/settings/SetIntegrationManager.tsx
@@ -70,13 +70,14 @@ export default class SetIntegrationManager extends React.Component<IProps, IStat
         }
 
         return (
-            <div className="mx_SetIntegrationManager">
+            <label className="mx_SetIntegrationManager" htmlFor="toggle_integration">
                 <div className="mx_SettingsFlag">
                     <div className="mx_SetIntegrationManager_heading_manager">
                         <span className="mx_SettingsTab_heading">{_t("Manage integrations")}</span>
                         <span className="mx_SettingsTab_subheading">{managerName}</span>
                     </div>
                     <ToggleSwitch
+                        id="toggle_integration"
                         checked={this.state.provisioningEnabled}
                         disabled={false}
                         onChange={this.onProvisioningToggled}
@@ -89,7 +90,7 @@ export default class SetIntegrationManager extends React.Component<IProps, IStat
                             "send room invites, and set power levels on your behalf.",
                     )}
                 </div>
-            </div>
+            </label>
         );
     }
 }