From ad5842c87a01a44499505c97e4bd37fa2894b199 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 29 Sep 2021 14:24:12 +0100
Subject: [PATCH] Allow closing Dropdown via its chevron

---
 src/components/views/elements/Dropdown.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/views/elements/Dropdown.tsx b/src/components/views/elements/Dropdown.tsx
index b4f382c9c3d..86e0822b110 100644
--- a/src/components/views/elements/Dropdown.tsx
+++ b/src/components/views/elements/Dropdown.tsx
@@ -178,6 +178,14 @@ export default class Dropdown extends React.Component<IProps, IState> {
         this.ignoreEvent = ev;
     };
 
+    private onChevronClick = (ev: React.MouseEvent) => {
+        if (this.state.expanded) {
+            this.setState({ expanded: false });
+            ev.stopPropagation();
+            ev.preventDefault();
+        }
+    };
+
     private onAccessibleButtonClick = (ev: ButtonEvent) => {
         if (this.props.disabled) return;
 
@@ -375,7 +383,7 @@ export default class Dropdown extends React.Component<IProps, IState> {
                 onKeyDown={this.onKeyDown}
             >
                 { currentValue }
-                <span className="mx_Dropdown_arrow" />
+                <span onClick={this.onChevronClick} className="mx_Dropdown_arrow" />
                 { menu }
             </AccessibleButton>
         </div>;