From 8773d67df7c19732ef9acaffdff60b30dc7ef19e Mon Sep 17 00:00:00 2001
From: Jorik Schellekens <joriksch@gmail.com>
Date: Wed, 8 Jul 2020 17:28:15 +0100
Subject: [PATCH] Auto expand room list on search

---
 src/components/structures/RoomSearch.tsx |  9 ++++++++-
 src/components/views/rooms/RoomList2.tsx | 11 +++++++++++
 src/dispatcher/actions.ts                | 10 ++++++++++
 src/stores/room-list/ListLayout.ts       | 12 ++++++++++++
 4 files changed, 41 insertions(+), 1 deletion(-)

diff --git a/src/components/structures/RoomSearch.tsx b/src/components/structures/RoomSearch.tsx
index 15f3bd5b54..349025782d 100644
--- a/src/components/structures/RoomSearch.tsx
+++ b/src/components/structures/RoomSearch.tsx
@@ -76,6 +76,7 @@ export default class RoomSearch extends React.PureComponent<IProps, IState> {
     private clearInput = () => {
         if (!this.inputRef.current) return;
         this.inputRef.current.value = "";
+        defaultDispatcher.dispatch({action: Action.StopRoomFilter})
         this.onChange();
     };
 
@@ -102,9 +103,15 @@ export default class RoomSearch extends React.PureComponent<IProps, IState> {
     private onFocus = (ev: React.FocusEvent<HTMLInputElement>) => {
         this.setState({focused: true});
         ev.target.select();
+        if (ev.target.value === "") {
+            defaultDispatcher.dispatch({action: Action.StartRoomFilter})
+        }
     };
 
-    private onBlur = () => {
+    private onBlur = (ev: React.FocusEvent<HTMLInputElement>) => {
+        if (ev.target.value === "") {
+            defaultDispatcher.dispatch({action: Action.StopRoomFilter})
+        }
         this.setState({focused: false});
     };
 
diff --git a/src/components/views/rooms/RoomList2.tsx b/src/components/views/rooms/RoomList2.tsx
index fb0136fb29..c294b2e1b0 100644
--- a/src/components/views/rooms/RoomList2.tsx
+++ b/src/components/views/rooms/RoomList2.tsx
@@ -194,6 +194,17 @@ export default class RoomList2 extends React.Component<IProps, IState> {
                     show_room_tile: true, // to make sure the room gets scrolled into view
                 });
             }
+        } else if (payload.action === Action.StartRoomFilter) {
+            this.state.layouts.forEach(x => {
+                x.saveCollapsedState();
+                x.isCollapsed = false;
+            });
+            this.forceUpdate();
+        } else if (payload.action === Action.StopRoomFilter) {
+            this.state.layouts.forEach(x => {
+                x.restoreCollapsedState();
+            });
+            this.forceUpdate();
         }
     };
 
diff --git a/src/dispatcher/actions.ts b/src/dispatcher/actions.ts
index 9be674b59e..89b2216db1 100644
--- a/src/dispatcher/actions.ts
+++ b/src/dispatcher/actions.ts
@@ -84,4 +84,14 @@ export enum Action {
      * Changes room based on room list order and payload parameters. Should be used with ViewRoomDeltaPayload.
      */
     ViewRoomDelta = "view_room_delta",
+
+    /**
+     * Informs the room list when room filtering has begun. No additional payload information required.
+     */
+    StartRoomFilter = "start_room_filter",
+
+     /**
+      * Informs the room list when room filtering has ended. No additional payload information required.
+      */
+    StopRoomFilter = "stop_room_filter",
 }
diff --git a/src/stores/room-list/ListLayout.ts b/src/stores/room-list/ListLayout.ts
index f31e92b8ae..7be284b0e5 100644
--- a/src/stores/room-list/ListLayout.ts
+++ b/src/stores/room-list/ListLayout.ts
@@ -26,12 +26,14 @@ interface ISerializedListLayout {
     numTiles: number;
     showPreviews: boolean;
     collapsed: boolean;
+    savedCollapsed: boolean;
 }
 
 export class ListLayout {
     private _n = 0;
     private _previews = false;
     private _collapsed = false;
+    private _savedCollapsed = false;
 
     constructor(public readonly tagId: TagID) {
         const serialized = localStorage.getItem(this.key);
@@ -41,6 +43,7 @@ export class ListLayout {
             this._n = parsed.numTiles;
             this._previews = parsed.showPreviews;
             this._collapsed = parsed.collapsed;
+            this._savedCollapsed = parsed.savedCollapsed;
         }
     }
 
@@ -136,11 +139,20 @@ export class ListLayout {
         localStorage.setItem(this.key, JSON.stringify(this.serialize()));
     }
 
+    public saveCollapsedState() {
+        this._savedCollapsed = this.isCollapsed;
+    }
+
+    public restoreCollapsedState() {
+        this.isCollapsed = this._savedCollapsed;
+    }
+
     private serialize(): ISerializedListLayout {
         return {
             numTiles: this.visibleTiles,
             showPreviews: this.showPreviews,
             collapsed: this.isCollapsed,
+            savedCollapsed: this._savedCollapsed,
         };
     }
 }