improve Settings Accessibility for Toggles and Dialogs

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

src/components/views/elements/ToggleSwitch.js

@@ -58,6 +58,9 @@ export default class ToggleSwitch extends React.Component {
     };
 
     render() {
+        // eslint-disable-next-line no-unused-vars
+        const {checked, disabled, onChange, ...props} = this.props;
+
         const classes = classNames({
             "mx_ToggleSwitch": true,
             "mx_ToggleSwitch_on": this.state.checked,
@@ -65,11 +68,13 @@ export default class ToggleSwitch extends React.Component {
         });
         return (
             <div
+                {...props}
                 className={classes}
                 onClick={this._onClick}
                 role="checkbox"
                 aria-checked={this.state.checked}
-                aria-disabled={this.props.disabled}>
+                aria-disabled={disabled}
+                tabIndex={0}>
                 <div className="mx_ToggleSwitch_ball" />
             </div>
         );